/* ============================================================
   BEVEZETŐ – „Hogyan játssz?” nyitókártya (js/bevezeto.js). A játékrétegek fölött, a kör végi ablak alatt – de a játékmenü ALATT:
   a Menü (hang, teljes képernyő) akkor is koppintható, amikor a kártya nyitva van (Kristóf, 2026-10-06; tools/menu-proba.js).
   A kártya ezért a Menü gomb sávja alatt kezdődik.
   Csak tokenekkel (docs/arculat.md).
   ============================================================ */
#bevezeto { position:fixed; inset:0; z-index:calc(var(--z-scene) + 4); display:grid; place-items:center; background:var(--scrim);
  padding:calc(var(--tap) + 24px + env(safe-area-inset-top, 0px)) 16px 16px; }
#bevezeto.hidden { display:none; }
.bevBox { position:relative; width:min(480px, 100%); max-height:calc(100dvh - var(--tap) - 40px - env(safe-area-inset-top, 0px)); overflow:auto; display:grid; gap:12px; padding:18px; }
.bevZar { position:absolute; top:10px; right:10px; }
.bevSay { align-items:flex-start; padding-right:44px; }
.bevSay .ds-avatar img { width:56px; height:56px; }
.bevCim { margin:0 0 6px; font:400 var(--fs-xl)/1.1 var(--display); color:var(--ink); text-wrap:balance; }
.bevCel { margin:0; display:flex; gap:8px; align-items:flex-start; line-height:1.4; }
.bevCel .pic { width:20px; height:20px; flex:none; margin-top:2px; }
.bevLepesek { list-style:none; margin:0; padding:0; display:grid; gap:8px; }
.bevLepesek li { display:flex; gap:10px; align-items:flex-start; line-height:1.4; }
.bevN { display:grid; place-items:center; flex:none; width:26px; height:26px; border-radius:50%; background:var(--accent); color:var(--on-accent);
  border:var(--line-w) solid var(--line); font:400 var(--fs-s)/1 var(--display); }
.bevGomb .pic { width:20px; height:20px; }