/* =====================================================
   AMNESIA – "FLASH CARTOON" stílusréteg
   2000-es évek Flash-oldalak hangulata: vastag körvonal,
   kemény matrica-árnyék, fényes gombok, ugrálós animációk.
   (minden más CSS után töltődik)
   ===================================================== */
:root{
  --ol:#12051f;              /* körvonal */
  --pop1:#ff2e88; --pop2:#2de2e6; --pop3:#ffd34d; --pop4:#9b7bff; --pop5:#7dff6a;
  --card:#25103d; --card2:#2f1450;
  --f-display:"Luckiest Guy","Bungee",system-ui,sans-serif;
  --f-body:"Fredoka","Space Grotesk",system-ui,sans-serif;
  --bounce:cubic-bezier(.34,1.56,.64,1);
}

/* ---------- alap ---------- */
body{font-family:var(--f-body);font-size:17px;letter-spacing:.1px}
body::before{content:"";position:fixed;inset:0;z-index:-1;pointer-events:none;opacity:.5;
  background-image:radial-gradient(rgba(255,255,255,.07) 1.2px,transparent 1.6px);background-size:22px 22px}
.lead,.tag,p{font-weight:500}
.scanlines{opacity:.25}

/* matrica-címkék a fejezetek fölött */
.kicker{display:inline-flex;align-items:center;gap:8px;padding:6px 14px 5px;border-radius:999px;background:var(--pop3);color:var(--ol);
  font-family:var(--f-display);font-weight:400;font-size:15px;letter-spacing:1.5px;border:3px solid var(--ol);box-shadow:3px 3px 0 var(--ol);transform:rotate(-3deg)}
.kicker::before{content:"★";width:auto;height:auto;background:none;font-size:13px}
.center .kicker{transform:rotate(2deg)}
.ph-inner .kicker{color:var(--ol)}

/* rajzfilmes címek */
.h2{filter:none}
.h2 .m{background:none;-webkit-background-clip:border-box;background-clip:border-box;color:#fff;-webkit-text-fill-color:#fff;
  font-family:var(--f-display);font-weight:400;letter-spacing:1px;
  -webkit-text-stroke:7px var(--ol);paint-order:stroke fill;text-shadow:5px 6px 0 var(--pop1),9px 11px 0 var(--ol)}
.h2 .s{font-size:.6em;-webkit-text-stroke:5px var(--ol);paint-order:stroke fill;background:none;-webkit-background-clip:border-box;background-clip:border-box;
  color:var(--pop2);-webkit-text-fill-color:var(--pop2);filter:drop-shadow(3px 3px 0 var(--ol));margin-bottom:.05em}
.h3{font-family:var(--f-display);font-weight:400;color:var(--pop3);-webkit-text-stroke:5px var(--ol);paint-order:stroke fill;text-shadow:3px 4px 0 var(--ol);letter-spacing:.5px}
.sub{font-family:var(--f-display);letter-spacing:.3em;text-shadow:2px 2px 0 var(--ol),0 0 14px rgba(255,46,136,.8)}

/* ---------- FÉNYES FLASH GOMBOK ---------- */
.btn,.tb-cta{position:relative;overflow:hidden;font-family:var(--f-display);font-weight:400;letter-spacing:1.2px;font-size:16px;text-transform:none;
  padding:13px 26px 11px;border-radius:18px;border:3px solid var(--ol)!important;color:#fff;background:linear-gradient(180deg,#4a2470,#2b0f45);
  box-shadow:0 6px 0 var(--ol),0 10px 20px rgba(0,0,0,.35);text-shadow:2px 2px 0 var(--ol);backdrop-filter:none;transition:transform .15s var(--bounce),box-shadow .15s}
.btn::before,.tb-cta::before{content:"";position:absolute;left:8%;right:8%;top:3px;height:42%;border-radius:12px 12px 40px 40px;
  background:linear-gradient(180deg,rgba(255,255,255,.55),rgba(255,255,255,.05));pointer-events:none}
.btn.hot,.tb-cta{background:linear-gradient(180deg,#ff6fb0 0%,#ff2e88 45%,#e2186f 100%)}
.btn:hover,.tb-cta:hover{transform:translateY(-3px) rotate(-1.5deg) scale(1.03);box-shadow:0 9px 0 var(--ol),0 14px 26px rgba(0,0,0,.4);background-color:transparent}
.btn:active,.tb-cta:active{transform:translateY(4px);box-shadow:0 2px 0 var(--ol)}
.btn.sm{font-size:13.5px;padding:9px 16px 8px;border-radius:14px}
.btn.hot::after{display:none}

/* ---------- FELSŐ SÁV ---------- */
.tb-links{background:var(--card);border:3px solid var(--ol);box-shadow:0 5px 0 var(--ol);padding:4px}
.tb-link{font-family:var(--f-body);font-weight:600;font-size:15.5px;opacity:1;color:#f0e6ff}
.tb-link:hover{background:rgba(255,255,255,.08);transform:rotate(-2deg)}
.tb-link.on{background:var(--pop3);color:var(--ol);box-shadow:inset 0 0 0 2px var(--ol);text-shadow:none}
.tb-drop{border:3px solid var(--ol);box-shadow:6px 6px 0 var(--ol),0 20px 50px rgba(0,0,0,.5);background:#22103a}
.mega-item i,.dr-links i{border:2px solid var(--ol);box-shadow:2px 2px 0 var(--ol);background:var(--pop4)}
.mega-item:nth-child(2) i,.dr-links a:nth-child(2) i{background:var(--pop2)}
.mega-item:nth-child(3) i,.dr-links a:nth-child(3) i{background:var(--pop3)}
.mega-item:nth-child(4) i,.dr-links a:nth-child(4) i{background:var(--pop1)}
.dr-links a:nth-child(5n) i{background:var(--pop5)}
.mega-item b,.dr-links b{font-family:var(--f-display);font-weight:400;letter-spacing:.6px;font-size:17px}
.topbar .status-pill{border:2px solid var(--ol);box-shadow:2px 2px 0 var(--ol)}
.tb-play{border:3px solid var(--ol)!important;box-shadow:0 4px 0 var(--ol)}
.user-chip{border:3px solid var(--ol);box-shadow:0 4px 0 var(--ol);background:var(--card)}
.tb-burger{border:3px solid var(--ol);background:var(--card);box-shadow:0 4px 0 var(--ol)}
.tb-cta{padding:10px 18px 8px;font-size:16px}
.dr-panel{border-left:4px solid var(--ol)}
.tabbar{border:3px solid var(--ol);box-shadow:0 6px 0 var(--ol),0 14px 30px rgba(0,0,0,.5);background:var(--card)}
.tabbar span{font-family:var(--f-body);font-weight:700}
.tabbar .mid{border:3px solid var(--ol);box-shadow:0 5px 0 var(--ol)}

/* ---------- KÁRTYÁK: körvonal + kemény színes árnyék ---------- */
.card,.stat,.rule,.member,.review,.cc,.tier .in,.tk-panel,.legal-sec,.legal-tldr,.legal-toc,.count-band,.faq details,.mix-out,.jobs,.result,.who-box,.tk-howto div,.cta-band,.tonight-in{
  border:3px solid var(--ol)!important;background:var(--card);box-shadow:7px 7px 0 var(--pop1);border-radius:24px}
.stat:nth-child(2),.rule:nth-child(2),.member:nth-child(4n+2),.review:nth-child(3n+2),.cc:nth-child(2),.tk-howto div:nth-child(2){box-shadow:7px 7px 0 var(--pop2)}
.stat:nth-child(3),.rule:nth-child(3),.member:nth-child(4n+3),.review:nth-child(3n),.cc:nth-child(3),.tk-howto div:nth-child(3){box-shadow:7px 7px 0 var(--pop3)}
.rule:nth-child(4),.member:nth-child(4n),.tk-howto div:nth-child(4){box-shadow:7px 7px 0 var(--pop4)}
.card:nth-child(even),.legal-sec:nth-child(even){box-shadow:7px 7px 0 var(--pop2)}
.card,.member,.rule,.cc,.stat,.review{transition:transform .25s var(--bounce),box-shadow .25s}
.card:hover,.member:hover,.rule:hover,.cc:hover,.stat:hover{transform:translate(-3px,-3px) rotate(-.6deg)}
.tonight-in{background:linear-gradient(135deg,#3a1460,#25103d);box-shadow:8px 8px 0 var(--pop3)}
.tn-col b{font-family:var(--f-display);font-weight:400;letter-spacing:.8px;font-size:24px}
.stat b,.tier .pr,.cd b,.tk-sum b,.cart-total b{font-family:var(--f-display)!important;font-weight:400}
.stat b{-webkit-text-stroke:5px var(--ol);paint-order:stroke fill;text-shadow:3px 3px 0 var(--ol)}
.tier.feat{background:none;animation:none;transform:rotate(-1deg) scale(1.03)}
.tier.feat .in{box-shadow:8px 8px 0 var(--pop3)}
.tier .flag{border:3px solid var(--ol);box-shadow:3px 3px 0 var(--ol);font-family:var(--f-display);font-weight:400;font-size:13px;letter-spacing:1px}
.member .ava{border:3px solid var(--ol);padding:4px}
.member h4,.review .who b{font-family:var(--f-display);font-weight:400;letter-spacing:.6px;font-size:18px}
.faq summary{font-family:var(--f-display);font-weight:400;letter-spacing:.6px;font-size:19px}
.faq details[open]{background:#2f1450}
.cc .ic,.rule .ic{border:3px solid var(--ol);box-shadow:3px 3px 0 var(--ol)}
.rule b,.cc small{font-family:var(--f-display);font-weight:400;letter-spacing:1px;font-size:16px}

/* flyerek mint kinyomtatott matricák */
.flyer{border:4px solid var(--ol);box-shadow:9px 9px 0 var(--ol);border-radius:26px}
.flyer:nth-child(odd){rotate:-1.5deg}.flyer:nth-child(even){rotate:1.2deg}
.flyer:hover{rotate:0deg;box-shadow:12px 12px 0 var(--pop3)}
.flyer h3{font-family:var(--f-display);font-weight:400;letter-spacing:.5px;font-size:40px;-webkit-text-stroke:6px var(--ol);paint-order:stroke fill;color:#fff;text-shadow:4px 4px 0 var(--ol)}
.flyer h3 em{-webkit-text-stroke:5px var(--ol);color:var(--pop3)!important;text-shadow:3px 3px 0 var(--ol)}
.flyer .meta{border:3px solid var(--ol);background:var(--ol)}
.star{border:none;filter:drop-shadow(3px 3px 0 var(--ol));font-family:var(--f-display);font-weight:400;font-size:13px}

/* felfedező csempék */
.hub a{border:4px solid var(--ol);box-shadow:8px 8px 0 var(--ol);border-radius:28px}
.hub a:nth-child(odd){rotate:-1deg}.hub a:nth-child(even){rotate:1deg}
.hub a:hover{rotate:0deg;transform:translateY(-8px) scale(1.02);box-shadow:12px 14px 0 var(--ol)}
.hub b{font-family:var(--f-display);font-weight:400;letter-spacing:1px;font-size:32px;-webkit-text-stroke:6px var(--ol);paint-order:stroke fill;text-shadow:4px 4px 0 var(--ol)}
.hub small{font-weight:600}
.hub a::after{border:3px solid var(--ol);background:var(--pop3);color:var(--ol);font-weight:900}
.cta-band h3{font-family:var(--f-display);font-weight:400;letter-spacing:1px;-webkit-text-stroke:6px var(--ol);paint-order:stroke fill;text-shadow:4px 4px 0 var(--pop1)}

/* szalagok mint ragasztószalag */
.ribbon{font-family:var(--f-display);font-weight:400;letter-spacing:2px;font-size:22px;border-top:3px solid var(--ol);border-bottom:3px solid var(--ol)}

/* polaroidok */
.pola{border:3px solid var(--ol);box-shadow:8px 8px 0 var(--ol)}

/* jegyek */
.ticket{border:3px solid var(--ol);box-shadow:8px 8px 0 var(--ol)}
.tk-ev{border:4px solid var(--ol);box-shadow:6px 6px 0 var(--ol)}
.tk-ev.on{box-shadow:6px 6px 0 var(--pop3);border-color:var(--ol)}
.tk-ev b,.ticket .tk-l b,.tk-status{font-family:var(--f-display)!important;font-weight:400;letter-spacing:.6px}

/* űrlapok */
.field input,.field select,.field textarea,.gate-form input{border:3px solid var(--ol)!important;background:#1a0b2c;border-radius:14px;box-shadow:inset 0 3px 0 rgba(0,0,0,.35)}
.field input:focus,.field select:focus,.field textarea:focus,.gate-form input:focus{box-shadow:inset 0 3px 0 rgba(0,0,0,.35),0 0 0 4px var(--pop2)!important}
.field label,.gate-form label{font-family:var(--f-display);font-weight:400;font-size:14px;letter-spacing:1.2px;color:var(--pop2)}

/* belépő kapu */
.gate-card{border:4px solid var(--ol);box-shadow:10px 10px 0 var(--pop1),0 40px 90px rgba(0,0,0,.6);background:#22103a}
.gate-card::before{display:none}
.gate-tabs{border:3px solid var(--ol)}
.gate-tabs button{font-family:var(--f-display);font-weight:400;letter-spacing:1px;font-size:14px}
.gate-tabs button.on{background:var(--pop3);color:var(--ol)}

/* lábléc */
.sf-col h4{font-family:var(--f-display);font-weight:400;font-size:17px;letter-spacing:1.5px;color:var(--pop3)}
.site-foot{border-top:4px solid var(--ol)}

/* sötét háttéren a fekete árnyék nem látszik → színes "matrica-árnyékok" */
.btn{box-shadow:0 6px 0 #5b1a7a,0 10px 22px rgba(0,0,0,.4)}
.btn:hover{box-shadow:0 9px 0 #5b1a7a,0 14px 26px rgba(0,0,0,.45)}
.btn:active{box-shadow:0 2px 0 #5b1a7a}
.btn.hot,.tb-cta{box-shadow:0 6px 0 #9e0f55,0 10px 24px rgba(255,46,136,.35)}
.btn.hot:hover,.tb-cta:hover{box-shadow:0 9px 0 #9e0f55,0 14px 30px rgba(255,46,136,.45)}
.btn.hot:active,.tb-cta:active{box-shadow:0 2px 0 #9e0f55}
.tb-links,.tb-play,.user-chip,.tb-burger{box-shadow:0 4px 0 #5b1a7a}
.flyer{box-shadow:9px 9px 0 var(--pop2)}
.flyer:nth-child(2n){box-shadow:9px 9px 0 var(--pop1)}
.flyer:nth-child(3n){box-shadow:9px 9px 0 var(--pop3)}
.flyer:hover{box-shadow:13px 13px 0 #fff}
.hub a{box-shadow:8px 8px 0 var(--pop3)}
.hub a:nth-child(2n){box-shadow:8px 8px 0 var(--pop2)}
.hub a:nth-child(3n){box-shadow:8px 8px 0 var(--pop1)}
.hub a:hover{box-shadow:12px 14px 0 #fff}
.pola,.ticket,.tk-ev{box-shadow:8px 8px 0 var(--pop4)}
.tk-ev.on{box-shadow:8px 8px 0 var(--pop3)}
.tabbar{box-shadow:0 6px 0 #5b1a7a,0 14px 30px rgba(0,0,0,.5)}

/* ---------- élesebb gombok: a csillogás a szöveg MÖGÖTT ---------- */
.btn,.tb-cta{isolation:isolate}
.btn::before,.tb-cta::before{z-index:-1;left:10px;right:10px;top:3px;height:40%;border-radius:10px 10px 22px 22px;background:linear-gradient(180deg,rgba(255,255,255,.42),rgba(255,255,255,0))}
.btn{background:linear-gradient(180deg,#5a2a86,#341256)}
.btn.hot,.tb-cta{background:linear-gradient(180deg,#ff5aa5 0%,#ff2e88 50%,#d8146a 100%)}
.btn,.tb-cta{text-shadow:0 2px 0 rgba(18,5,31,.85),2px 2px 0 rgba(18,5,31,.85)}

/* ---------- KÖZÖSSÉG (Discord) kártya a láblécben ---------- */
.sf-discord{position:relative;isolation:isolate;display:inline-flex;align-items:center;gap:14px;max-width:100%;padding:12px 16px 12px 12px;border-radius:20px;text-decoration:none;color:#fff;
  background:linear-gradient(135deg,#6b77ff,#5865f2 55%,#4752c4);border:3px solid var(--ol);box-shadow:0 6px 0 #2f3794,0 14px 28px rgba(88,101,242,.35);
  transition:transform .2s var(--bounce),box-shadow .2s}
.sf-discord::before{content:"";position:absolute;z-index:-1;left:10px;right:10px;top:3px;height:42%;border-radius:12px 12px 26px 26px;background:linear-gradient(180deg,rgba(255,255,255,.35),rgba(255,255,255,0))}
.sf-discord:hover{transform:translateY(-3px) rotate(-1deg);box-shadow:0 9px 0 #2f3794,0 18px 34px rgba(88,101,242,.5)}
.sf-discord:active{transform:translateY(4px);box-shadow:0 2px 0 #2f3794}
.sfd-ic{flex-shrink:0;width:48px;height:48px;border-radius:14px;display:grid;place-items:center;background:#fff;border:3px solid var(--ol);box-shadow:2px 2px 0 var(--ol)}
.sfd-ic svg{width:28px;height:28px;fill:#5865f2}
.sfd-t{display:flex;flex-direction:column;gap:2px;min-width:0}
.sfd-t b{font-family:var(--f-display);font-weight:400;font-size:18px;letter-spacing:.8px;line-height:1.1;text-transform:uppercase;-webkit-text-stroke:4px var(--ol);paint-order:stroke fill;text-shadow:2px 2px 0 var(--ol)}
.sfd-t small{font-weight:600;font-size:13px;color:#e6e8ff;text-shadow:0 1px 0 rgba(18,5,31,.6)}
.sfd-go{flex-shrink:0;width:34px;height:34px;border-radius:50%;display:grid;place-items:center;font-weight:700;font-size:18px;background:var(--pop3);color:var(--ol);border:3px solid var(--ol);transition:transform .2s var(--bounce)}
.sf-discord:hover .sfd-go{transform:translateX(4px) rotate(-12deg)}
.sf-discord[hidden]{display:none}
.sf-discord{width:100%;max-width:400px}
.sfd-t b{font-size:16.5px}
.sfd-t small{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}

/* ---------- KONTRASZT: világosabb, kontúros feliratok ---------- */
:root{--text-dim:#f1e6ff}
.lead,.tag,.legal-sec p,.legal-sec li,.sf-col a,.sf-col span,.sf-brand p,.tn-col small,.drink small,.stat small,.rule p,.review p,.faq details p,.tier li,.flyer p{color:#f3eaff}
.tag,.ph-inner .lead,.hero .tag{font-weight:600;color:#fff;text-shadow:0 0 1px #12051f,2px 2px 0 #12051f,-1px -1px 0 #12051f,1px -1px 0 #12051f,-1px 1px 0 #12051f,0 6px 18px rgba(18,5,31,.8)}
.est{font-weight:700;color:#fff;text-shadow:2px 2px 0 #12051f;opacity:1}
.sub{color:#fff;text-shadow:0 0 1px #12051f,2px 2px 0 #12051f,-1px -1px 0 #12051f,0 0 16px rgba(255,46,136,.8)}
.motto span{-webkit-text-stroke:5px #12051f;paint-order:stroke fill}
.onair{background:#12051f;border:2px solid #fff;font-weight:600}
.topbar .status-pill{background:#0b2a17;color:#7dffb0;font-size:11px}
.topbar .status-pill.closed{background:#3a0d16;color:#ff9aa6}
.topbar .status-pill.private{background:#3a2a05;color:#ffe08a}
.countdown{background:#12051f;border:3px solid #fff;box-shadow:5px 5px 0 var(--pop1)}
.countdown .lbl{color:var(--pop2);font-size:11px}.countdown .lbl b{font-size:13px}
.cd b{-webkit-text-stroke:4px #12051f;paint-order:stroke fill;text-shadow:2px 2px 0 #12051f}
.cd small{opacity:1;color:#e8ddff}
.skyswitch{background:#12051f;border:3px solid #fff}
.flyer .day{font-size:12px}
.flyer p{font-weight:600}
.f1 p,.f2 p,.f4 p{color:#12051f}
.f3 p,.f5 p,.f6 p{color:#fff;text-shadow:1px 1px 0 #12051f}
.flyer .meta{font-size:12px}
.drink b,.member h4{color:#fff}
.drink .p,.tier .pr{-webkit-text-stroke:4px #12051f;paint-order:stroke fill}
.legal-toc a,.sf-bottom{color:#e6dbf7}
.page-hero .ph-scene circle{opacity:.5}

/* ---------- ÉLŐ RÁDIÓ panel ---------- */
.radio-live{margin-top:20px;padding:18px 20px;border-radius:22px;background:var(--card);border:3px solid var(--ol);box-shadow:7px 7px 0 var(--pop2)}
.rl-head{display:flex;align-items:center;gap:10px;margin-bottom:10px}
.rl-badge{display:inline-flex;align-items:center;gap:7px;padding:4px 11px 3px;border-radius:999px;background:#ff3b3b;color:#fff;border:2px solid var(--ol);font-family:var(--f-display);font-size:14px;letter-spacing:1.5px;box-shadow:2px 2px 0 var(--ol)}
.rl-badge i{width:8px;height:8px;border-radius:50%;background:#fff;animation:pulse 1s infinite}
.rl-label{font-family:var(--f-display);font-size:14px;letter-spacing:1.5px;color:var(--pop3);text-shadow:2px 2px 0 var(--ol)}
.rl-now b{display:block;font-family:var(--f-display);font-weight:400;font-size:clamp(22px,2.6vw,30px);line-height:1.1;letter-spacing:.6px;text-transform:uppercase;color:#fff;-webkit-text-stroke:5px var(--ol);paint-order:stroke fill;text-shadow:3px 3px 0 var(--pop1);word-break:break-word}
.rl-now small{display:block;margin-top:4px;font-weight:600;color:var(--pop2)}
.rl-bar{position:relative;height:14px;margin:14px 0 8px;border-radius:999px;background:#12051f;border:3px solid var(--ol);overflow:hidden}
.rl-bar span{display:block;height:100%;width:0;background:repeating-linear-gradient(-45deg,var(--pop3) 0 10px,#ff8a3d 10px 20px);transition:width .5s linear}
.rl-meta{display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap;font-weight:600;font-size:14px;color:#f3eaff}
.rl-meta span:first-child{font-family:var(--f-display);letter-spacing:1px;color:var(--pop3)}
.rl-vol{display:flex;align-items:center;gap:10px;margin-top:14px}
.rl-vol input{flex:1;accent-color:var(--pop1)}
#radioQueue li{cursor:default}
#radioQueue li.empty{opacity:.75}

/* a rajzfilmes betűtípus csupa nagybetűvel néz ki jól */
.kicker,.h2 .m,.h3,.sub,.btn,.tb-cta,.mega-item b,.dr-links b,.tn-col b,.tier .flag,.member h4,.review .who b,.faq summary,.rule b,.cc small,.flyer h3,.star,.hub b,.cta-band h3,.ribbon,
.tk-ev b,.ticket .tk-l b,.tk-status,.field label,.gate-form label,.gate-tabs button,.sf-col h4,.m-bubble,.fl-title,.fl-pct{text-transform:uppercase}
.h2 .s,.flyer h3 em{text-transform:none}
.faq summary{font-size:17px;line-height:1.3}

/* ---------- UGRÁLÓS MEGJELENÉS ---------- */
.rv{transform:translateY(40px) scale(.92) rotate(-2deg);transition:opacity .5s,transform .7s var(--bounce)}
.rv.in{transform:none}

/* apró csillámok a háttérben */
.sparkle{position:absolute;pointer-events:none;color:var(--pop3);font-size:22px;animation:twinkle 2.4s ease-in-out infinite;text-shadow:2px 2px 0 var(--ol);z-index:0}
@keyframes twinkle{0%,100%{transform:scale(.6) rotate(0);opacity:.4}50%{transform:scale(1.15) rotate(25deg);opacity:1}}

/* =====================================================
   KABALAFIGURA – a csibész diszkópatkány
   ===================================================== */
.mascot{position:fixed;left:14px;bottom:14px;z-index:185;width:118px;cursor:pointer;filter:drop-shadow(4px 5px 0 var(--ol));
  animation:mascotIn .9s var(--bounce) 1.2s both;-webkit-tap-highlight-color:transparent}
.mascot svg{display:block;width:100%;height:auto;transform-origin:50% 90%;animation:groove 1.1s ease-in-out infinite alternate}
.playing .mascot svg{animation-duration:.45s}
.mascot:hover svg{animation-duration:.35s}
.mascot .paw{transform-origin:140px 172px;animation:wave .6s ease-in-out infinite alternate}
@keyframes groove{from{transform:rotate(-5deg) translateY(0)}to{transform:rotate(5deg) translateY(-6px)}}
@keyframes wave{from{transform:rotate(-12deg)}to{transform:rotate(18deg)}}
@keyframes mascotIn{from{transform:translateY(160px) rotate(-30deg)}}
.m-bubble{position:absolute;left:100%;bottom:70%;margin-left:4px;width:max-content;max-width:230px;padding:10px 14px 9px;border-radius:18px;
  background:#fff;color:var(--ol);border:3px solid var(--ol);box-shadow:4px 4px 0 var(--ol);font-family:var(--f-display);font-size:15px;letter-spacing:.5px;line-height:1.25;
  transform-origin:0 100%;animation:bubble .45s var(--bounce) both}
.m-bubble::after{content:"";position:absolute;left:-12px;bottom:12px;border:8px solid transparent;border-right:12px solid var(--ol)}
.m-bubble.out{animation:bubbleOut .25s ease-in forwards}
@keyframes bubble{from{transform:scale(0) rotate(-12deg)}}
@keyframes bubbleOut{to{transform:scale(0);opacity:0}}
.mascot-x{position:absolute;top:-6px;right:-4px;width:22px;height:22px;border-radius:50%;border:2px solid var(--ol);background:var(--pop3);color:var(--ol);font:700 12px/1 var(--f-body);cursor:pointer;display:grid;place-items:center;opacity:0;transition:opacity .2s}
.mascot:hover .mascot-x{opacity:1}
@media (hover:none){ .mascot-x{opacity:1} }

/* ---------- FLASH BETÖLTŐ (főoldal) ---------- */
.intro.flash{background:radial-gradient(circle at 50% 45%,#5b1a7a,#12051f 70%);animation:introOut .5s ease 2.3s forwards}
.intro.flash::before{display:none}
.fl-load{display:grid;justify-items:center;gap:16px;text-align:center;font-family:var(--f-display);color:#fff}
.fl-load svg{width:120px;filter:drop-shadow(4px 5px 0 #000);animation:groove .35s ease-in-out infinite alternate}
.fl-title{font-size:clamp(34px,7vw,64px);letter-spacing:2px;-webkit-text-stroke:8px var(--ol);paint-order:stroke fill;text-shadow:5px 5px 0 var(--pop1)}
.fl-bar{width:min(320px,70vw);height:26px;border-radius:999px;border:4px solid #000;background:#1a0b2c;overflow:hidden;box-shadow:4px 4px 0 #000}
.fl-bar i{display:block;height:100%;width:0;background:repeating-linear-gradient(-45deg,var(--pop3) 0 12px,#ff8a3d 12px 24px);animation:flLoad 1.9s cubic-bezier(.5,0,.3,1) forwards}
@keyframes flLoad{70%{width:78%}100%{width:100%}}
.fl-pct{font-size:20px;letter-spacing:2px;color:var(--pop3);text-shadow:2px 2px 0 #000}
.fl-skip{font-family:var(--f-body);font-weight:600;font-size:13px;opacity:.6}

@media (max-width:760px){
  .mascot{width:84px;left:8px;bottom:92px}
  .m-bubble{max-width:180px;font-size:13.5px}
  .h2 .m{-webkit-text-stroke:5px var(--ol);text-shadow:4px 4px 0 var(--pop1),7px 8px 0 var(--ol)}
  .flyer:nth-child(n),.hub a:nth-child(n){rotate:0deg}
  .card,.stat,.rule,.member,.review,.cc,.tier .in,.tk-panel,.legal-sec{box-shadow:5px 5px 0 var(--pop1)}
}
@media (prefers-reduced-motion:reduce){ .mascot svg,.mascot .paw,.sparkle{animation:none!important} }
@media print{ .mascot{display:none!important} }

/* jegy: fiókonként 1 db, csak magadnak */
.tk-one{display:flex;align-items:center;min-height:48px;padding:10px 14px;border-radius:14px;border:3px solid var(--ol);background:#1a0b2c;font-weight:700;color:#fff}
.tk-have{display:grid;gap:4px;margin:0 0 14px;padding:12px 14px;border-radius:14px;border:3px solid var(--ol);font-weight:600;color:#fff}
.tk-have.valid{background:rgba(61,220,132,.18);box-shadow:4px 4px 0 #3ddc84}
.tk-have.pending{background:rgba(255,211,77,.16);box-shadow:4px 4px 0 var(--pop3)}
.tk-have small{font-weight:500;font-size:13px;color:#f3eaff}
.tk-next[disabled]{opacity:.45;cursor:not-allowed;transform:none!important}
