/* games/gonogo.html and games/gonogo-rules.html: what only Go/No-Go needs (the page: board-game.css + puzzle.css).
   The meeting is a grid of department cards; each has its statement and two lamps, GO and NO-GO. */
.hero{background:linear-gradient(135deg,rgba(63,185,80,.18),var(--card) 45%,rgba(248,81,73,.14))}

.gn-rule{margin:0 0 12px;font-size:14px}
.gn-table{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:12px}
.gn-dept{background:var(--card);border:2px solid var(--border);border-radius:14px;padding:14px;display:flex;flex-direction:column;gap:10px;transition:border-color .15s}
.gn-dept.is-go{border-color:var(--green)}
.gn-dept.is-nogo{border-color:var(--red)}
.gn-dept h3{margin:0;font-size:16px;display:flex;align-items:center;gap:8px}
.gn-ic{font-size:22px}
.gn-say{margin:0;font-size:16px;line-height:1.4;flex:1}
.gn-say::before{content:'“'}
.gn-say::after{content:'”'}
.gn-lamps{display:flex;gap:8px}
.gn-lamp{flex:1;min-height:44px;border-radius:10px;border:2px solid var(--border);background:transparent;color:var(--muted);font:inherit;font-weight:800;letter-spacing:.04em;cursor:pointer}
.gn-lamp.go:hover,.gn-lamp.go:focus-visible{border-color:var(--green);color:var(--text)}
.gn-lamp.nogo:hover,.gn-lamp.nogo:focus-visible{border-color:var(--red);color:var(--text)}
.gn-lamp.go[aria-pressed="true"]{background:var(--green);border-color:var(--green);color:#04130a}
.gn-lamp.nogo[aria-pressed="true"]{background:var(--red);border-color:var(--red);color:#fff}

.gn-decide{display:flex;align-items:center;gap:12px;flex-wrap:wrap;margin:16px 0 4px}
.gn-decide p{flex:1 1 240px;margin:0}
.gn-decide p.wrong{color:var(--red);font-weight:700}
.gn-call{min-height:48px;padding:0 22px;font-size:16px}
.gn-call.nogo{background:var(--red);border-color:var(--red);color:#fff}

/* The example beside the start page and on the rules page */
.gn-mini{display:flex;flex-direction:column;gap:6px;margin:10px 0 6px}
.gn-mini-row{display:grid;grid-template-columns:auto 1fr auto;gap:8px;align-items:center;border:2px solid var(--border);border-radius:10px;padding:6px 10px;font-size:13px}
.gn-mini-row span::before{content:'“'}
.gn-mini-row span::after{content:'”'}
.gn-mini-row i{font-style:normal;font-weight:800;font-size:12px;border-radius:6px;padding:2px 6px}
.gn-mini-row.go{border-color:var(--green)}
.gn-mini-row.go i{background:var(--green);color:#04130a}
.gn-mini-row.nogo{border-color:var(--red)}
.gn-mini-row.nogo i{background:var(--red);color:#fff}
.gn-mini-cap{font-size:13px;color:var(--muted);margin:0 0 8px}

@media (max-width:520px){
  .gn-table{grid-template-columns:1fr}
  .gn-say{font-size:15px}
  .gn-call{flex:1 1 100%}
}