/* ══════════════════════════════════════════════════════════════════
   The Gallery - one room per screen.

   A gallery is not a dense page and it is not an empty one. It is one
   object, modest in size, alone in a big room, lit properly. The room
   is what costs the space; the object is what earns it.

   Three things carry the feeling, and none of them is more content:
     · SCALE      a placard at 10px next to a title at 68px
     · LIGHT      a soft light behind each plate, brightest at its top
     · SETTLING   the plate arrives from below and its shadow deepens
                  as it lands, so it reads as an object being placed

   Colour still never touches chrome. The light is white at 3-5%.
   ══════════════════════════════════════════════════════════════════ */

.room{position:relative;min-height:100vh;display:flex;flex-direction:column;
  align-items:center;justify-content:center;gap:clamp(24px,3.4vh,44px);
  /* the bar is sticky and 70px tall, so the top pad has to clear it or a
     centred title sits under the nav on a laptop */
  padding:clamp(120px,15vh,190px) var(--gut) clamp(70px,9vh,130px)}


/* the light in the room */
/* Full-bleed and fully faded before it reaches any edge. A gradient box
   that still has value at its own boundary draws a rectangle, and a
   rectangle of light is the opposite of light. */
.room::before{content:"";position:absolute;inset:0;pointer-events:none;
  background:radial-gradient(78% 58% at 50% 26%,rgba(255,255,255,.05),transparent 58%);
  opacity:0;transition:opacity 1.8s var(--glide)}
.room.lit::before{opacity:1}

/* the placard */
.card-label{display:flex;align-items:baseline;gap:16px;justify-content:center;
  text-align:center;flex-direction:column;align-items:center;max-width:52ch}
.card-label .no{font:400 11px var(--mono);color:var(--dim);letter-spacing:.22em;
  margin-bottom:clamp(14px,2vh,26px)}
.card-label h2{max-width:20ch;text-align:center;
  font-size:clamp(34px,5.2vw,68px);line-height:1.02;letter-spacing:-.042em}
.card-label p{font-size:15.5px;line-height:1.65;color:var(--ghost);max-width:46ch;
  text-align:center}

/* the object itself */
.exhibit{position:relative;width:100%;display:flex;justify-content:center;
  opacity:0;transform:translateY(38px) scale(.985);
  transition:opacity 1.15s var(--glide),transform 1.15s var(--glide),filter 1.15s var(--glide);
  filter:brightness(.86)}
.room.lit .exhibit{opacity:1;transform:none;filter:none}
html:not(.js) .exhibit{opacity:1;transform:none;filter:none}

/* a plate: a framed screen hung on the wall */
.plate{position:relative;width:min(880px,100%);border-radius:18px;overflow:hidden;
  background:var(--paper);
  box-shadow:inset 0 0 0 1px var(--w3),inset 0 1px 0 rgba(255,255,255,.06),
             0 2px 6px rgba(0,0,0,.4),0 30px 60px -20px rgba(0,0,0,.6),
             0 60px 120px -40px rgba(0,0,0,.75)}
.plate .pb,.cwin .pb{height:34px;display:flex;align-items:center;gap:6px;padding:0 14px;
  border-bottom:1px solid var(--w2);background:var(--card)}
.plate .pb i,.cwin .pb i{width:8px;height:8px;border-radius:999px;background:var(--w3)}
.plate .pb span,.cwin .pb span{margin-left:9px;font:500 11.5px var(--sans);color:var(--faint)}
.plate .pbody{padding:22px;display:flex;flex-direction:column;gap:14px}

/* what goes inside the plates */
.pfield{height:40px;border-radius:11px;box-shadow:inset 0 0 0 1px var(--w3);display:flex;
  align-items:center;padding:0 14px;font:400 13.5px var(--mono);color:var(--faint);gap:9px}
.pfield b{color:var(--soft);font-weight:400}
.prow{display:flex;flex-direction:column;gap:9px}
.pnote2{font:400 12px var(--sans);color:var(--dim);padding-top:4px}
.ptitle{font:500 21px var(--sans);letter-spacing:-.026em;color:var(--ink)}
.ptxt{height:8px;border-radius:4px;background:var(--w2)}
.ptxt.a{width:92%}.ptxt.b{width:74%}.ptxt.c{width:84%}.ptxt.d{width:58%}
.ptable{display:grid;grid-template-columns:1.4fr 1fr 1fr;gap:0;
  box-shadow:inset 0 0 0 1px var(--w2);border-radius:10px;overflow:hidden}
.ptable div{padding:9px 12px;font:400 12.5px var(--sans);color:var(--soft);
  border-top:1px solid var(--w2)}
.ptable div:nth-child(-n+3){border-top:0;font:600 9px var(--sans);letter-spacing:.14em;
  text-transform:uppercase;color:var(--ghost)}
.ptable .n{font-family:var(--mono);font-variant-numeric:tabular-nums;text-align:right}
.pcheck{display:flex;align-items:center;gap:10px;font:400 13.5px var(--sans);color:var(--soft)}
.pcheck s{width:14px;height:14px;border-radius:4px;box-shadow:inset 0 0 0 1px var(--w4);
  text-decoration:none;flex:none}
.pcheck.on s{background:var(--w4)}
.pcheck.on{color:var(--faint);text-decoration:line-through;text-decoration-color:var(--dim)}

.mhead{display:grid;grid-template-columns:repeat(7,1fr);gap:6px}
.mhead span{font:600 8.5px var(--sans);letter-spacing:.16em;text-transform:uppercase;
  color:var(--ghost);padding-bottom:2px}
.mcal{display:grid;grid-template-columns:repeat(7,1fr);gap:6px}
.mcal .d{aspect-ratio:1.25;border-radius:8px;background:var(--w1);
  box-shadow:inset 0 0 0 1px var(--w2);padding:6px 7px;display:flex;flex-direction:column;gap:4px}
.mcal .d .n{font:400 10.5px var(--mono);color:var(--faint)}
.mcal .d.today{box-shadow:inset 0 0 0 1px var(--w4)}
.mcal .d.today .n{color:var(--ink)}
.mcal .d .b{height:4px;border-radius:2px;background:var(--ec,var(--w3))}
.mcal .d.out{opacity:.4}

.plabels{display:flex;flex-direction:column;gap:2px}
.plabel{display:flex;align-items:center;gap:12px;padding:12px 4px;
  border-bottom:1px solid var(--w2);font:400 14.5px var(--sans);color:var(--mid)}
.plabel s{width:3px;height:16px;border-radius:2px;background:var(--ec);text-decoration:none}
.plabel em{margin-left:auto;font:400 11.5px var(--mono);font-style:normal;color:var(--dim)}
.plabel.add{color:var(--dim);border-bottom:0}

/* the big room: the app's own window, wider than a plate */
.hall .exhibit{width:100%}
.hall .frame{width:min(1240px,100%);margin:0 auto;
  box-shadow:inset 0 0 0 1px var(--w3),0 2px 6px rgba(0,0,0,.4),
             0 40px 80px -24px rgba(0,0,0,.62),0 90px 160px -50px rgba(0,0,0,.8)}

/* the text rooms keep the same placard, and set their content wider */
.room .pairs{margin-top:0;width:min(1000px,100%)}
.room .zoo{width:min(1080px,100%);grid-template-columns:repeat(6,minmax(0,1fr))}
.room .pair{width:min(940px,100%)}

/* the way out */
.exit{display:flex;flex-direction:column;align-items:center;gap:22px;
  padding:clamp(70px,10vh,120px) var(--gut) clamp(50px,7vh,90px);text-align:center}
.exit h2{max-width:18ch;text-align:center}

@media(max-width:900px){
  .room{min-height:auto;padding:clamp(64px,9vh,110px) var(--gut)}
  .plate .pbody{padding:16px}
  .room .zoo{grid-template-columns:repeat(3,minmax(0,1fr))}
}
@media (prefers-reduced-motion:reduce){
  .exhibit{opacity:1;transform:none;filter:none}
  .room::before{opacity:1}
}

/* the hall's window is the tallest thing in the gallery; hold it to a size
   that still leaves room for the placard on a laptop screen */
.hall .viewport{aspect-ratio:auto;height:min(54vh,560px)}
.hall .plate,.room .plate{max-height:none}
@media(max-width:900px){ .hall .viewport{height:min(60vh,520px)} }

/* ══════════════════════════════════════════════════════════════════
   Things you can touch.
   ══════════════════════════════════════════════════════════════════ */

/* ── the desk: one control, bottom centre, out of the way ────────── */
/* ── the one control on the site ──────────────────────────────────────
   Rewritten 2026-09-01. Two things were wrong with it. It was hardcoded
   dark - a black pill with white type - which is invisible on the film's
   cream, and it was invisible on the first screen anyway: it faded in
   only after 260px of scroll, so a person landing on the title card had
   no way to change the ground.

   This sheet loads LAST on the gallery and FIRST on the front page, so
   these rules have to be right for both grounds. They read the ramp now
   rather than naming a colour. */
.desk{position:fixed;right:26px;bottom:26px;z-index:60;
  display:flex;align-items:center;gap:14px;padding:9px 14px;border-radius:999px;
  background:color-mix(in srgb,var(--paper) 76%,transparent);
  -webkit-backdrop-filter:saturate(150%) blur(22px);backdrop-filter:saturate(150%) blur(22px);
  box-shadow:inset 0 0 0 1px var(--w3),0 18px 50px var(--sh2);
  opacity:1;pointer-events:auto;transform:none;
  transition:opacity .6s var(--glide),transform .6s var(--glide)}
.desk .dgroup{display:flex;gap:6px}
.desk .cap{height:27px;padding:0 15px;color:var(--faint);
  box-shadow:inset 0 0 0 1px var(--line)}
.desk .cap:hover{color:var(--ink)}
.desk .cap.on{background:var(--on);color:var(--ink);box-shadow:none}
.dsep{width:1px;height:20px;background:var(--w3)}
.dswatches{display:flex;gap:7px}
.dsw{width:20px;height:20px;border:0;border-radius:999px;cursor:pointer;padding:0;
  box-shadow:inset 0 0 0 1px var(--w4);transition:transform .35s var(--glide)}
.dsw:hover{transform:scale(1.14)}
.dsw.on{box-shadow:inset 0 0 0 1px var(--w4),0 0 0 2px var(--paper),0 0 0 3.5px var(--ink)}
@media(max-width:760px){ .desk{right:50%;transform:translate(50%,0)}
  .dswatches .dsw:nth-child(n+5){display:none} }

/* an exhibit on white paper needs a lighter shadow or it looks printed on */
body.white-paper .plate,body.white-paper .frame,body.white-paper .hall .frame{
  box-shadow:inset 0 0 0 1px rgba(0,0,0,.12),0 2px 6px rgba(0,0,0,.06),
             0 26px 50px -18px rgba(0,0,0,.22),0 60px 110px -40px rgba(0,0,0,.28)}

/* ── the invitation: every touchable room says so, quietly ───────── */
.tryhint{display:inline-flex;align-items:center;gap:9px;margin-top:2px;
  font:600 9px var(--sans);letter-spacing:var(--tr);text-indent:var(--tr);
  text-transform:uppercase;color:var(--dim)}
.tryhint::before{content:"";width:5px;height:5px;border-radius:999px;background:var(--cr);
  animation:pulse 2.6s var(--glide) infinite}
@keyframes pulse{0%,100%{opacity:.35;transform:scale(1)}50%{opacity:1;transform:scale(1.35)}}

/* ── room 02: type into it ───────────────────────────────────────── */
.dumpin{width:100%;height:46px;border:0;border-radius:12px;padding:0 15px;
  font:400 14.5px var(--sans);color:var(--ink);background:var(--w1);
  box-shadow:inset 0 0 0 1px var(--w3);outline:none;
  transition:box-shadow .4s var(--glide)}
.dumpin::placeholder{color:var(--dim)}
.dumpin:focus{box-shadow:inset 0 0 0 1px var(--w5)}
.trylines{display:flex;gap:8px;flex-wrap:wrap}
.tryline{border:0;cursor:pointer;background:none;border-radius:999px;height:28px;padding:0 14px;
  font:400 12.5px var(--sans);color:var(--faint);box-shadow:inset 0 0 0 1px var(--w2);
  transition:color .4s var(--glide),box-shadow .4s var(--glide)}
.tryline:hover{color:var(--ink);box-shadow:inset 0 0 0 1px var(--w4)}
.tryline.on{color:var(--ink);box-shadow:inset 0 0 0 1px var(--w4)}
.filedbox{display:flex;flex-direction:column;gap:14px;min-height:150px}
.fgrp{display:flex;flex-direction:column;gap:7px}
.fgrp .caps{color:var(--dim)}
.filedbox .chip{opacity:0;transform:translateX(12px);animation:land .55s var(--glide) forwards}
.filedbox .empty,.ld .empty{font:400 13.5px var(--sans);color:var(--dim);padding-top:10px}

/* ── room 03: tick them ──────────────────────────────────────────── */
.pcheck{cursor:pointer;user-select:none;transition:color .35s var(--glide)}
.pcheck s{transition:background .35s var(--glide),box-shadow .35s var(--glide)}

/* ── room 05: a label is a filter ────────────────────────────────── */
.plabel[data-ec]{cursor:pointer;border-radius:8px;padding-left:10px;margin-left:-10px;
  transition:background .35s var(--glide),color .35s var(--glide)}
.plabel[data-ec]:hover{background:var(--w1);color:var(--ink)}
.plabel.on{background:var(--w2);color:var(--ink)}
.dimmed{opacity:.18;filter:saturate(.2)}
.chip,.ev,.mcal .b{transition:opacity .5s var(--glide),filter .5s var(--glide)}

/* ── room 06: click a sentence ───────────────────────────────────── */
.pairs .sd[data-say]{cursor:pointer;border-radius:10px;padding-left:12px;margin-left:-12px;
  transition:color .35s var(--glide),background .35s var(--glide)}
.pairs .sd[data-say]:hover{color:var(--ink);background:var(--w1)}
.pairs .sd.on{color:var(--ink)}
.pairs .ld{min-height:54px}

/* ── room 07: the creature, on the edge, holding on ──────────────── */
.stage{position:relative;width:min(880px,100%);display:flex;flex-direction:column;gap:0}
.cwin{position:relative;border-radius:18px;background:var(--paper);overflow:hidden;
  box-shadow:inset 0 0 0 1px var(--w3),0 2px 6px rgba(0,0,0,.4),
             0 30px 60px -20px rgba(0,0,0,.6)}
.cwin .pb{border-radius:18px 18px 0 0}
/* the creature keeps a lane on the right so it never sits on the words */
.cwin .cbody{position:relative;z-index:2;padding:22px 132px 22px 22px;display:flex;flex-direction:column;gap:16px;min-height:250px;
  border-radius:0 0 18px 18px;overflow:hidden}
.csaid{font-family:var(--serif);font-style:italic;font-size:19px;line-height:1.5;
  color:var(--soft);min-height:58px}
.cfiled{display:flex;flex-direction:column;gap:12px}

/* the grip. Origin at 50%/75% of the picture, parked ON the right edge so
   the window's own bounds bite the paws off, then rotated to PeekEdge.right. */
/* It GRIPS the edge. The rotation origin is the grip - 50% across the
   picture, 75% down it - that point is parked on the window's right edge,
   and the window's own clipping bites the paws off. PeekEdge.right = 254°;
   HUDController.startMotion sways it about the same point. */
/* The six pictures are all 120 tall but between 65 and 136 wide, and they
   are tightly cropped, so equal file height does NOT mean equal creature: a
   rabbit is mostly ears and an otter is mostly width. Each one is scaled by
   its own painted area instead, and hung from its own centre, both measured
   off the files and written into the script. Height, offset and pivot all
   come from there - this rule only sets what they have in common. */
/* the nail is the INSIDE of the title bar, not the outside of the window:
   hung from the outer edge, the bar covered most of the animal */
.creature{position:absolute;left:66%;top:34px;width:auto;max-width:none;
  pointer-events:none;z-index:1;
  transform:rotate(140deg);
  animation:sway 3.4s ease-in-out infinite;
  /* height eases; the offsets must land at once or the creature drifts
     off its nail while the size catches up */
  transition:height .55s var(--glide)}
@keyframes sway{0%,100%{transform:rotate(138deg)}50%{transform:rotate(142deg)}}
/* under the title bar, never on top of it: on top reads as placed, not held */
.cwin .pb{position:relative;z-index:2}
.cclip{position:absolute;inset:0;border-radius:18px;overflow:hidden;pointer-events:none;z-index:2}

.ctools{display:flex;align-items:center;gap:14px;flex-wrap:wrap;margin-top:20px;
  justify-content:center}
.ctalk{height:44px;padding:0 22px;border:0;border-radius:999px;cursor:pointer;
  font:500 14.5px var(--sans);letter-spacing:-.014em;color:var(--soft);background:none;
  box-shadow:inset 0 0 0 1px var(--w3);
  transition:color .4s var(--glide),box-shadow .4s var(--glide),background .4s var(--glide)}
.ctalk:hover{color:var(--ink);box-shadow:inset 0 0 0 1px var(--w5)}
.stage.talking .ctalk{background:var(--on);color:var(--ink)}
.cmeter{display:flex;align-items:center;gap:5px;height:26px}
.cmeter i{width:4px;height:4px;border-radius:2px;background:var(--cr);opacity:.4;
  transition:height .07s linear,opacity .4s var(--glide)}
.stage.talking .cmeter i{opacity:1}
.cpicks{display:flex;gap:9px;flex-wrap:wrap;justify-content:center;margin-top:18px}
.cpick{width:56px;height:56px;border:0;border-radius:14px;cursor:pointer;padding:8px;
  background:var(--card);box-shadow:inset 0 0 0 1px var(--w2);
  transition:transform .4s var(--glide),box-shadow .4s var(--glide)}
.cpick img{height:34px;width:auto;margin:0 auto}
.cpick:hover{transform:translateY(-3px)}
.cpick.on{box-shadow:inset 0 0 0 1px var(--w5),0 8px 20px var(--sh1)}

/* ── room 01: the blocks move ────────────────────────────────────── */
.grabbable{cursor:grab}
.grabbable:hover{box-shadow:inset 3px 0 0 var(--ec,var(--line)),inset 0 0 0 1px var(--w5)}
.lifted{cursor:grabbing;z-index:9;transform:scale(1.03);
  box-shadow:inset 3px 0 0 var(--ec,var(--line)),inset 0 0 0 1px var(--w5),
             0 18px 34px rgba(0,0,0,.5)}
body.dragging{user-select:none}

@media (prefers-reduced-motion:reduce){
  .creature{animation:none}
  .tryhint::before{animation:none}
}

/* Anything inside an exhibit inherits that exhibit's ink, not the page's.
   Without this, every element with no colour of its own keeps the dark
   page's near-white and vanishes the moment the paper goes white. */
.exhibit,.plate,.frame,.cwin,.win,.pane,.side{color:var(--ink)}

/* a block being moved must not also be text being selected */
.ev{user-select:none;-webkit-user-select:none}
.cpick img{height:34px;width:auto;margin:auto}
.cpick{display:flex;align-items:center;justify-content:center}


/* ══════════════════════════════════════════════════════════════════
   Room 03 - the page the app wrote, 2026-09-01.

   The Lisbon note went out: the film already spends four seconds on it,
   and nothing should be on the site twice. What replaces it shows the
   part the film never has time to say out loud - that the model did
   arithmetic. The clock column counts backwards from the hour you named.
   ══════════════════════════════════════════════════════════════════ */
.plate.wide2{width:min(1020px,100%)}

.phead{display:flex;align-items:flex-start;justify-content:space-between;gap:28px;
  padding-bottom:20px;border-bottom:1px solid var(--w2);flex-wrap:wrap}
.psub{margin-top:6px;font:400 13.5px var(--sans);color:var(--ghost);letter-spacing:-.008em}

/* what was actually said, kept in the person's own voice */
.psaid{max-width:34ch;font-family:var(--serif);font-style:italic;font-size:15px;
  line-height:1.5;color:var(--faint);letter-spacing:-.006em;text-align:right}
@media(max-width:760px){ .psaid{text-align:left;max-width:none} }

.pcols{display:grid;grid-template-columns:1.15fr .85fr;gap:clamp(24px,3.4vw,54px);
  padding-top:20px}
@media(max-width:760px){ .pcols{grid-template-columns:1fr;gap:28px} }
.pcol{display:flex;flex-direction:column;gap:9px;min-width:0}
.pcol > .caps{color:var(--ghost);margin-bottom:3px}

/* the clock column: two columns, not three, and the hour is the figure */
.ptable.back{grid-template-columns:auto 1fr}
.ptable.back .n{text-align:left;color:var(--faint);padding-right:18px}
.ptable.back div.on{color:var(--ink);font-weight:500}
.ptable.back .n.on{color:var(--cr)}

/* the two plates that are different, and the one thing still unknown */
.pdiet{margin:0;font:400 13.5px/1.5 var(--sans);color:var(--soft);letter-spacing:-.008em}
.pdiet b{font-weight:500;color:var(--ink);margin-right:7px}
.pdiet.quiet{color:var(--dim);font-style:italic}


/* ══════════════════════════════════════════════════════════════════
   Room 07 - rebuilt 2026-09-01. It never comes in.

   What was wrong: the creature was parked at 66% inside a window that
   was otherwise empty, so it read as a sticker on a panel, and the panel
   claimed to be the app while showing nothing an app would show.

   The film has the answer already. The creature hangs on the open
   ground at the top right, whole, never clipped, and whatever is on
   screen is something the person was already doing. So: the window here
   is a half-written mail, the app is not in it, and the animal grips its
   corner from outside. The HUD underneath is the only surface the app
   ever puts up.
   ══════════════════════════════════════════════════════════════════ */
.stage{overflow:visible;padding-top:26px}

/* the window is now what YOU were in, so it is paper, not the app's dark */
.cwin{background:var(--card)}
.cwin .cbody{padding:26px 30px 30px;min-height:0;gap:11px}
.cwin .cbody .ptxt{height:9px}
.cwin .cbody .ptxt.a{width:96%}
.cwin .cbody .ptxt.b{width:63%}
.cwin .cbody .ptxt.c{width:88%}
.cwin .cbody .ptxt.d{width:41%}
.cwin .caret{display:block;width:1.5px;height:15px;margin-top:4px;background:var(--cr);
  animation:blink 1.15s steps(1) infinite}
@keyframes blink{0%,49%{opacity:1}50%,100%{opacity:0}}

/* the grip lands exactly on the anchor: the script parks the animal's own
   hold point here with negative margins, so this is the nail, not a corner
   of the picture */
.creature{left:calc(100% - 52px);top:14px}
.stage.talking .creature{animation-duration:1.5s}

/* ── the HUD: the one surface it ever shows you ─────────────────── */
.hud{position:relative;z-index:3;width:min(560px,100%);margin:-30px 0 0 auto;
  padding:20px 24px 22px;border-radius:16px;background:var(--card);
  display:flex;flex-direction:column;gap:12px;
  box-shadow:inset 0 0 0 1px var(--line),0 22px 50px -22px var(--sh2)}
.hud .csaid{font-size:17px;min-height:52px;color:var(--mid)}
.hud .cfiled:empty{display:none}
@media(max-width:760px){ .hud{width:100%;margin:-22px 0 0} }

/* ── the controls read as one row, not as a sheet of stickers ───── */
.ctools{margin-top:26px;justify-content:flex-start;gap:18px}
.cwho{display:flex;align-items:center;gap:12px;margin-left:auto;
  padding-left:18px;border-left:1px solid var(--w2)}
.cwho .caps{color:var(--ghost)}
.cpicks{display:flex;gap:5px;flex-wrap:nowrap;margin-top:0}
.cpick{width:38px;height:38px;border-radius:10px;padding:5px;background:none;
  box-shadow:inset 0 0 0 1px transparent}
.cpick img{height:24px}
.cpick:hover{transform:none;box-shadow:inset 0 0 0 1px var(--w3)}
.cpick.on{background:var(--w1);box-shadow:inset 0 0 0 1px var(--w4)}
@media(max-width:700px){
  .ctools{flex-direction:column;align-items:flex-start}
  .cwho{margin-left:0;padding-left:0;border-left:0}
}

/* the app's window is white on the film's cream, the way the film shows it,
   not a second sheet of the same cream */
body.white-paper .plate,body.white-paper .cwin,body.white-paper .hud{background:#FFF}
body.white-paper .cwin,body.white-paper .hud{
  box-shadow:inset 0 0 0 1px rgba(0,0,0,.10),0 2px 6px rgba(0,0,0,.05),
             0 24px 48px -18px rgba(0,0,0,.20)}

/* it hangs in FRONT of the window it is holding on to */
.creature{z-index:5}

/* ── the app window is an app, not a page of prose ───────────────────
   Grabbing a block and missing it started a text selection instead, and
   a selection drag scrolls the page under you: it read as "the calendar
   will not let me move this". Nothing inside the window is text you
   would want to select. 2026-09-01. */
.win,.wbody{user-select:none;-webkit-user-select:none}
.wbody .ev{touch-action:none}
