/* THE PUZZLE WEEK (static/js/games/puzzleweek.js): the card as a grid of lit squares; a paid row or column glows
   amber. No loops. */
.pw-root { --ac: var(--holo, #4fe3ff); --aa: var(--amber, #ffb020); }
.pw-card { display: grid; grid-template-columns: 54px repeat(var(--n), minmax(40px, 64px)); gap: 6px; align-items: center; }
.pw-gh { display: flex; flex-direction: column; align-items: center; font: 700 18px var(--mono); color: var(--ac); }
.pw-gh i { font-style: normal; }
.pw-gh small { font: 600 8px var(--mono); letter-spacing: .08em; color: rgba(160, 210, 235, .7); text-align: center; }
.pw-gh.paid, .pw-dh.paid { color: var(--aa); text-shadow: 0 0 8px rgba(255, 176, 32, .6); }
.pw-dh { font: 700 11px var(--mono); letter-spacing: .15em; color: rgba(160, 210, 235, .75); }
.pw-dh.now { color: #fff; }
.pw-sq { aspect-ratio: 1; margin: 0; padding: 0; border: 1px solid rgba(79, 227, 255, .55); background: linear-gradient(160deg, #13233a, #0a1424); color: #1a0d00; font: 700 18px var(--mono) !important; cursor: pointer;
  clip-path: polygon(0 0, calc(100% - 7px) 0, 100% 7px, 100% 100%, 7px 100%, 0 calc(100% - 7px)); }
.pw-sq.on { background: linear-gradient(145deg, #ffd27a, var(--aa)); border-color: var(--aa); box-shadow: 0 0 12px rgba(255, 176, 32, .4); }
.pw-sq.todo { border-color: var(--ac); box-shadow: inset 0 0 0 1px var(--ac); }
.pw-sq.future { opacity: .35; cursor: default; }
@media (max-width: 520px) { .pw-card { grid-template-columns: 38px repeat(var(--n), 1fr); gap: 4px; } .pw-gh small { display: none; } }