/* White Fortress "Enroll" strip. One slim line at the very top of every page.
   Shared by index.html (fixed, content is pushed down) and the 15 crawlable pages (in the page flow).
   To hide it everywhere: delete the <aside class="wfcta"> block. To change the link: edit the two hrefs. */
:root{--wfc-h:40px}
.wfcta{position:relative;z-index:120;display:flex;align-items:center;gap:6px;width:100%;height:var(--wfc-h);
  padding:0 12px;background:linear-gradient(90deg,#26165f,#1e1348 55%,#26165f);
  border-bottom:3px solid var(--line,#3b2a85);color:var(--text,#efeaff);
  font:500 13px/1.2 'Chakra Petch',system-ui,sans-serif}
.wfcta *{box-sizing:border-box}
.wfcta-go{flex:1;min-width:0;display:flex;align-items:center;justify-content:center;gap:14px;height:100%;
  color:inherit;text-decoration:none}
.wfcta-txt{min-width:0;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;color:var(--dim,#b3a9e0)}
.wfcta-txt b{color:var(--text,#efeaff);font-weight:700}
.wfcta-s{display:none}
.wfcta-btn{position:relative;flex:none;overflow:hidden;display:inline-block;padding:8px 12px;
  font:400 9px/1 'Press Start 2P','Courier New',monospace;letter-spacing:.5px;white-space:nowrap;
  color:#1a0a3a;background:var(--gold,#ffd23f);box-shadow:0 3px 0 #b88a00;
  transition:transform .12s,box-shadow .12s}
.wfcta-btn i{font:700 13px/1 system-ui,sans-serif;display:inline-block;margin-left:5px;vertical-align:-1px;transition:transform .15s}
/* one soft glint across the button, once, a moment after the page loads. No looping. */
.wfcta-btn::after{content:"";position:absolute;top:0;bottom:0;left:-40%;width:30%;
  background:linear-gradient(100deg,transparent,rgba(255,255,255,.65),transparent);
  transform:skewX(-20deg);opacity:0;animation:wfctaGlint 1.1s ease-out 1.8s 1 both}
@keyframes wfctaGlint{0%{left:-40%;opacity:1}100%{left:130%;opacity:1}}
.wfcta-go:hover .wfcta-btn,.wfcta-go:focus-visible .wfcta-btn{transform:translateY(-1px);box-shadow:0 4px 0 #b88a00}
.wfcta-go:hover .wfcta-btn i,.wfcta-go:focus-visible .wfcta-btn i{transform:translateX(3px)}
.wfcta-go:hover .wfcta-txt b{color:var(--cyan,#29e7ff)}
.wfcta-go:hover{text-decoration:none}
.wfcta-go:focus-visible{outline:3px solid var(--cyan,#29e7ff);outline-offset:-3px}
@media (max-width:620px){
  .wfcta{font-size:12.5px;padding:0 10px;gap:2px}
  .wfcta-go{justify-content:space-between;gap:10px}
  .wfcta-d{display:none}
}
@media (max-width:380px){.wfcta-l{display:none}.wfcta-s{display:inline}}
@media (prefers-reduced-motion:reduce){.wfcta-btn::after{animation:none}.wfcta-btn,.wfcta-btn i{transition:none}}
@media print{.wfcta{display:none}}

/* ---- game page (index.html): the strip is fixed to the top and everything else is pushed down ---- */
html.wfcta-fixed{--ctah:calc(var(--wfc-h) + env(safe-area-inset-top,0px))}
html.wfcta-fixed .wfcta{position:fixed;top:0;left:0;right:0;height:var(--ctah);padding-top:env(safe-area-inset-top,0px)}
html.wfcta-fixed body{padding-top:var(--wfc-h)}