
.card-game-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1rem;margin-top:1rem}.card-game-tile{display:flex;flex-direction:column;gap:.85rem;text-decoration:none;color:inherit;min-height:100%;overflow:hidden;padding:1.3rem}.card-game-tile h2{margin:0}.card-game-tile p{margin:0}.card-game-preview{display:grid;place-items:center;min-height:150px;padding:1rem;border-radius:1rem;background:radial-gradient(circle at 50% 30%,rgba(74,154,105,.23),transparent 45%),linear-gradient(145deg,#15382d,#0b211b);border:1px solid rgba(255,255,255,.08);box-shadow:inset 0 0 34px rgba(0,0,0,.24)}.mini-hand-stack{display:flex;flex-direction:column;align-items:center;gap:.42rem}.mini-hand{display:flex;justify-content:center}.mini-card{width:31px;height:44px;margin-left:-8px;display:grid;place-items:center;border-radius:.35rem;background:#faf8f2;color:#151515;border:1px solid rgba(0,0,0,.28);font:900 .8rem Georgia,serif;box-shadow:0 4px 8px rgba(0,0,0,.25);transform:rotate(var(--r,0deg))}.mini-card:first-child{margin-left:0}.mini-card.red{color:#bd2235}.mini-label{font-size:.72rem;letter-spacing:.08em;text-transform:uppercase;color:rgba(255,255,255,.66)}.game-mode-tags{display:flex;flex-wrap:wrap;gap:.4rem}.game-mode-tags span{padding:.28rem .48rem;border-radius:999px;border:1px solid rgba(226,164,108,.25);background:rgba(226,164,108,.08);font-size:.78rem}.card-game-tile strong{margin-top:auto;color:var(--copper,#e2a46c)}
@media(max-width:900px){.card-game-grid{grid-template-columns:1fr}.card-game-preview{min-height:132px}}

.mini-knock-word{margin-top:.2rem;font:900 1rem/1 "Trebuchet MS",Impact,sans-serif;letter-spacing:.08em;color:#e2a46c;transform:rotate(-7deg);text-shadow:0 2px 0 rgba(54,25,9,.55)}.knock31-preview{background:radial-gradient(circle at 50% 30%,rgba(226,164,108,.16),transparent 43%),linear-gradient(145deg,#173c31,#0b211b)}
.crazy-eights-preview{background:radial-gradient(circle at 50% 30%,rgba(122,106,230,.2),transparent 44%),linear-gradient(145deg,#202a50,#10182d)}
@media(min-width:901px) and (max-width:1100px){.card-game-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}

/* Othello's preview uses a tiny board and two embossed discs. */
.othello-hub-preview{background:radial-gradient(circle at 50% 40%,rgba(109,106,247,.28),transparent 48%),linear-gradient(145deg,#1d1b43,#0b121d)}
.othello-mini-board{display:grid;grid-template-columns:repeat(4,24px);grid-template-rows:repeat(4,24px);gap:2px;padding:5px;border:1px solid rgba(226,164,108,.62);border-radius:5px;background:#25234d;box-shadow:0 8px 18px rgba(0,0,0,.3)}
.othello-mini-board i{display:block;border-radius:2px;background:rgba(255,255,255,.08)}
.othello-mini-board i.mini-dark,.othello-mini-board i.mini-light{position:relative;border:2px solid #eee8d8;border-radius:50%;background:#17191e;box-shadow:0 2px 3px rgba(0,0,0,.4)}
.othello-mini-board i.mini-light{border-color:#17191e;background:#f3f1e7}

.chess-hub-preview{background:radial-gradient(circle at 50% 40%,rgba(226,164,108,.24),transparent 48%),linear-gradient(145deg,#31231d,#11181b)}
.chess-mini-board{display:grid;grid-template-columns:repeat(8,22px);grid-template-rows:repeat(2,22px);gap:1px;padding:5px;border:1px solid rgba(226,164,108,.62);border-radius:5px;background:#6f472c;box-shadow:0 8px 18px rgba(0,0,0,.3)}
.chess-mini-board i{display:grid;place-items:center;background:#e4c69b;color:#43291e;font:900 1rem/1 Georgia,serif}.chess-mini-board i:nth-child(even){background:#9b623f;color:#f5e7ce}.chess-mini-board i:nth-child(n+9){font-size:.82rem}


/* Night Chain preview: glowing "wire" traces echo the game's cosmic circuitry without
   changing the shared card-game tile layout. */
.night-chain-preview{position:relative;overflow:hidden;background:radial-gradient(circle at 50% 45%,rgba(98,86,214,.26),transparent 35%),linear-gradient(145deg,#10152e,#070b18)}
.night-chain-wire-field{position:relative;width:100%;height:118px;display:grid;place-items:center;overflow:hidden;border-radius:.8rem}
.night-chain-wire-field::before,.night-chain-wire-field::after{content:"";position:absolute;inset:12% -8%;border:1px solid rgba(112,198,255,.30);border-left-color:transparent;border-right-color:transparent;transform:skewY(-11deg);box-shadow:0 0 12px rgba(112,198,255,.10)}
.night-chain-wire-field::after{inset:30% -12% 8%;border-color:rgba(225,164,108,.26);border-left-color:transparent;border-right-color:transparent;transform:skewY(13deg)}
.night-wire{position:absolute;height:1px;background:linear-gradient(90deg,transparent,rgba(132,210,255,.78),transparent);box-shadow:0 0 8px rgba(132,210,255,.45);transform-origin:left center}
.night-wire::before,.night-wire::after{content:"";position:absolute;width:5px;height:5px;border-radius:50%;top:-2px;background:currentColor;box-shadow:0 0 10px currentColor}
.night-wire::before{left:18%}.night-wire::after{right:17%}.night-wire-a{color:#7fd5ff;width:82%;left:7%;top:23%;transform:rotate(6deg)}.night-wire-b{color:#e2a46c;width:76%;left:18%;top:66%;transform:rotate(-8deg)}.night-wire-c{color:#91e0ad;width:64%;left:3%;top:82%;transform:rotate(13deg)}
.night-chain-mark{position:relative;z-index:2;display:grid;justify-items:center;gap:.18rem;padding:.75rem 1rem;border:1px solid rgba(255,255,255,.12);border-radius:.85rem;background:rgba(6,10,25,.72);backdrop-filter:blur(5px);box-shadow:0 10px 26px rgba(0,0,0,.28)}
.night-chain-mark span{font-size:1.1rem;color:#b6a8ff;text-shadow:0 0 13px rgba(182,168,255,.8)}.night-chain-mark strong{font:900 .92rem/1.1 "Trebuchet MS",system-ui,sans-serif;letter-spacing:.14em;color:#f4f2ff}.night-chain-mark small{font-size:.56rem;letter-spacing:.12em;color:rgba(226,232,255,.62)}

/* Pocket Pet preview is intentionally self-contained on the Games hub. */
.pocket-pet-preview{display:flex;align-items:center;justify-content:center;gap:1rem;background:radial-gradient(ellipse at center,rgba(116,99,198,.26),transparent 65%),linear-gradient(135deg,#111b2c,#0c1521)}
.pocket-pet-mini{position:relative;width:58px;height:56px;border-radius:44% 44% 40% 40%;background:linear-gradient(145deg,#b8a1ff,#8367d9);box-shadow:inset -5px -5px rgba(66,46,130,.22),0 7px 20px rgba(128,103,217,.28)}
.pocket-pet-mini .pet-antenna{position:absolute;left:27px;top:-12px;width:4px;height:13px;border-radius:8px;background:#80f2cd}.pocket-pet-mini .pet-antenna:before{content:"";position:absolute;width:10px;height:10px;left:-3px;top:-5px;border-radius:50%;background:#80f2cd;box-shadow:0 0 10px rgba(128,242,205,.7)}
.pocket-pet-mini .pet-eyes{position:absolute;top:22px;left:15px;right:15px;display:flex;justify-content:space-between}.pocket-pet-mini .pet-eyes i{width:6px;height:9px;border-radius:50%;background:#152238;box-shadow:inset 2px 1px #fff}.pocket-pet-mini .pet-smile{position:absolute;width:9px;height:5px;top:35px;left:24px;border-bottom:2px solid #593f88;border-radius:0 0 50% 50%}.pocket-pet-hearts{color:#b5a1ff;font-size:.9rem}
.midnight-dash-hub-preview{position:relative;display:flex;align-items:center;justify-content:center;gap:1.15rem;overflow:hidden;background:radial-gradient(circle at 50% 35%,rgba(112,186,133,.16),transparent 48%),linear-gradient(145deg,#0b1e22,#09141d)}.midnight-dash-hub-preview:before{content:"";position:absolute;left:8%;right:8%;bottom:24%;height:1px;background:linear-gradient(90deg,transparent,rgba(141,231,197,.35),transparent);box-shadow:0 13px rgba(141,231,197,.15),0 26px rgba(141,231,197,.1)}.dash-hub-moon{font-size:2.4rem;color:#ffdc83;text-shadow:0 0 18px rgba(255,220,131,.45)}.dash-hub-dog{font-size:2.7rem;filter:drop-shadow(0 5px 7px rgba(0,0,0,.45))}.dash-hub-sprinkler{color:#8de7c5;font-size:1.8rem;text-shadow:0 0 12px rgba(141,231,197,.6)}.dash-hub-biscuit{position:absolute;bottom:13%;color:#f3cb7a;font-size:.8rem;letter-spacing:.4rem}
.midnight-dash-hub-preview{gap:.45rem}.dash-hub-moon{flex:none;font-size:2.1rem}.dash-hub-dog,.dash-hub-sprinkler,.dash-hub-tennis-ball,.dash-hub-biscuit{position:relative;bottom:auto;display:block;flex:none;width:44px;height:44px;font-size:0;letter-spacing:0;color:transparent;background-image:url('/games/kotas-midnight-dash/sprites.svg?v=96');background-repeat:no-repeat;background-size:264px 44px;filter:drop-shadow(0 4px 5px rgba(0,0,0,.4))}.dash-hub-dog{background-position:0 0}.dash-hub-sprinkler{background-position:-88px 0}.dash-hub-tennis-ball{background-position:-176px 0}.dash-hub-biscuit{background-position:-220px 0}
