/* Source-ROM bitmap lettering, native window tiles and pixel-aligned artwork. */
@font-face{font-family:CodyFireRed;src:url('./native/login/firered-native.ttf') format('truetype');font-weight:400;font-style:normal;font-display:block}
#authLayer.trainerAccess{
  --login-px:2px;position:fixed;inset:0;z-index:1000;display:flex;align-items:center;justify-content:center;
  padding:max(28px,env(safe-area-inset-top)) max(16px,env(safe-area-inset-right)) max(28px,env(safe-area-inset-bottom)) max(16px,env(safe-area-inset-left));
  overflow:auto;overscroll-behavior:contain;-webkit-overflow-scrolling:touch;touch-action:pan-y;
  background:#284969 url('./native/login/pokeball-pattern.png') center / 192px 128px repeat;
  color-scheme:light;color:#383838;font:400 32px/1 CodyFireRed,monospace;
  image-rendering:pixelated;font-synthesis:none;
}
#authLayer .entryScreen{position:relative;width:min(640px,100%);margin:auto}
#authLayer .entryMain{display:flex;flex-direction:column;align-items:center}
#authLayer .entryHero{display:flex;flex-direction:column;align-items:center;width:100%;padding:0}
#authLayer .entryLogo{display:block;width:332px;max-width:90%;height:auto;image-rendering:pixelated}
#authLayer .entryBrand{width:100%;min-height:32px;margin:8px 0 12px;padding:0;background:none;border:0;color:#fff}
#authLayer .entryStarters{display:block;width:288px;max-width:90%;height:auto;image-rendering:pixelated}
#authLayer .entryCard{
  width:576px;max-width:100%;min-width:0;margin-top:16px;padding:16px 24px 20px;
  border:16px solid transparent;border-image:url('./native/login/window-cream.png') 8 fill / 16px / 0 stretch;
  box-shadow:4px 4px 0 #183048;image-rendering:pixelated;
}
#authLayer .entryCard h1{--login-px:3px;margin:0;color:#383838;font-size:0}
#authLayer .entryIntro{margin:4px 0 20px;color:#505058;font-size:0}
#authLayer #authForm{display:grid;grid-template-columns:156px minmax(0,1fr);align-items:center;column-gap:12px;row-gap:12px}
#authLayer #authForm label{margin:0;color:#383838;font-size:0;letter-spacing:0}
#authLayer #authForm input{
  display:block;width:100%;min-width:0;min-height:44px;margin:0;padding:0 8px;
  border:0;border-bottom:4px solid #a0a890;border-radius:0;outline:0;background:#e8e8d0;color:#383838;
  font:400 32px/40px CodyFireRed,monospace;box-shadow:inset 2px 2px 0 #d0d0b8;
  letter-spacing:0;touch-action:manipulation;user-select:text;-webkit-user-select:text;-webkit-appearance:none;appearance:none;
}
#authLayer #authForm input::placeholder{color:#888878;opacity:1;text-shadow:none}
#authLayer #authForm input:focus{background:#ffffe8;border-color:#3878b0}
#authLayer .entryActions{grid-column:1/-1;display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-top:8px}
#authLayer #authSubmit,#authLayer #authSignup,#authLayer #authGuest{
  position:relative;display:block;width:100%;min-height:48px;margin:0;padding:0 16px;
  border:8px solid transparent;border-radius:0;border-image:url('./native/login/window-gray.png') 8 / 8px / 0 stretch;
  background:#f8f8e0;color:#383838;font:400 32px/32px CodyFireRed,monospace;
  letter-spacing:0;text-align:center;box-shadow:none;cursor:pointer;touch-action:manipulation;-webkit-appearance:none;appearance:none;
}
#authLayer #authSubmit{background:#285888;border-image-source:url('./native/login/window-blue.png')}
#authLayer #authGuest{margin-top:12px;background:#e8f0d8}
#authLayer #authSubmit::before,#authLayer #authGuest::before{content:none}
#authLayer :is(#authSubmit,#authSignup,#authGuest):is(:hover,:focus-visible){outline:2px solid #4080b0;outline-offset:2px;background:#d8e8f0}
#authLayer :is(#authSubmit,#authSignup,#authGuest):active{transform:translateY(2px);background:#c8d8e8}
#authLayer :is(#authSubmit,#authSignup,#authGuest):disabled{opacity:.6;cursor:wait;transform:none}
#authLayer .entryMessage{margin:12px 0 0;font:400 16px/20px CodyFireRed,monospace;overflow-wrap:anywhere}
#authLayer #authError{color:#a83030}#authLayer #authResult{color:#386038}
#authLayer .entryMessage:empty{display:none}
#authLayer .entryDisclaimer{max-width:576px;margin:20px auto 0;color:#d0e0e8;text-align:center;font:400 16px/18px CodyFireRed,monospace;text-shadow:1px 1px #183048}
#authLayer .entryDisclaimer strong{font-weight:400;color:#fff}
/* Override game-frame cqw sizing: login glyphs always use complete source pixels. */
#authLayer .frTextLine{display:flex;align-items:flex-start;white-space:nowrap;height:calc(16 * var(--login-px))!important;min-height:calc(16 * var(--login-px))!important}
#authLayer .frGlyph{
  display:inline-block;flex:none;width:calc((var(--fr-width) + var(--fr-spacing,1)) * var(--login-px))!important;
  height:calc(16 * var(--login-px))!important;background-image:url('./native/fr_font.png');background-repeat:no-repeat;
  background-size:calc(256 * var(--login-px)) calc(512 * var(--login-px))!important;
  background-position:calc(var(--fr-col) * -16 * var(--login-px)) calc(var(--fr-row) * -16 * var(--login-px))!important;image-rendering:pixelated;
}
#authLayer :is(.entryBrand,h1,.entryIntro,button) .frTextLine{justify-content:center}
#authLayer .entryBrand .frGlyph,#authLayer #authSubmit .frGlyph{background-image:url('./native/fr_font_light.png')}
#authLayer #authSubmit:is(:hover,:focus-visible) .frGlyph{background-image:url('./native/fr_font.png')}
@media(max-width:600px){
  #authLayer.trainerAccess{padding-top:max(20px,env(safe-area-inset-top));padding-bottom:max(20px,env(safe-area-inset-bottom))}
  #authLayer .entryLogo{width:249px}
  #authLayer .entryBrand{margin:4px 0 8px}
  #authLayer .entryStarters{width:216px}
  #authLayer .entryCard{padding:12px 16px 16px;border-width:8px;border-image-width:8px}
  #authLayer .entryCard h1{--login-px:2px}
  #authLayer .entryIntro{--login-px:1px;margin:4px 0 16px}
  #authLayer #authForm{grid-template-columns:minmax(0,1fr);row-gap:4px}
  #authLayer #authForm input{margin-bottom:8px}
  #authLayer .entryActions{gap:8px;margin-top:4px}
  #authLayer .entryDisclaimer{max-width:400px;margin-top:16px}
}

.pokemonBanScreen[hidden]{display:none!important}
.pokemonBanScreen{position:fixed!important;inset:0!important;z-index:999999!important;display:flex;align-items:center;justify-content:center;padding:24px;background:#101b25;color:#1b3440;font-family:monospace}
.pokemonBanCard{width:min(560px,94vw);text-align:center;padding:32px 22px;background:#f5f2df;border:6px solid #4e7274;box-shadow:inset 0 0 0 4px #d8e7dc,8px 8px 0 #070d18}
.pokemonBanCard h1{margin:12px 0;font-size:clamp(18px,4vw,30px);letter-spacing:.08em;color:#8c3446}
.pokemonBanCard p{font-size:clamp(15px,3vw,23px);font-weight:700;line-height:1.5;margin:0}
.pokemonBanMark{margin:auto;border:5px solid #8c3446;border-radius:50%;color:#8c3446;width:64px;height:64px;display:grid;place-items:center;font-size:38px;font-weight:900}
