/* ---------- the Christmas tree in the hi-fi room's corner (xmastree.js) ----------
   Three canvases, one over the other: the tree as the room's light shows it (it darkens with the
   dimmer, like the furniture), the bulbs' own light on the needles, balls and tinsel (added on top:
   strongest when the room is dark), and the bulbs themselves, which stay lit. It stands above the
   room's darkness (z 4, like the console); the room's darkness opens round it (hifi.css, --xt-glow). */
.xmas-tree { position: absolute; z-index: 4; display: none; cursor: pointer; }
.xmas-tree.on { display: block; }
.xmas-tree canvas { position: absolute; inset: 0; width: 100%; height: 100%; display: block; }
.xt-day { filter: brightness(calc(1 - var(--dark, 0) * .96)); }
.xt-glow { mix-blend-mode: plus-lighter; opacity: 0; transition: opacity .4s; }
.xmas-tree.lit .xt-glow { opacity: calc(.25 + var(--dark, 0) * .75); }
.xt-bulbs { opacity: 0; transition: opacity .25s; }
.xmas-tree.lit .xt-bulbs { opacity: 1; }