/* TakaraDex refinement layer — unified shell, loading states and responsive polish */
:root{
  --td-shell-header:96px;
  --td-shell-sidebar:244px;
  --td-shell-gap:24px;
  --td-mobile-nav:72px;
  --td-radius-sm:12px;
  --td-radius:18px;
  --td-radius-lg:24px;
  --td-focus:0 0 0 3px rgba(216,181,90,.24);
}

html{color-scheme:dark;scroll-behavior:smooth;}
body{min-width:0!important;overflow-x:hidden!important;}
button,input,select,textarea,a{font:inherit;}
button,a,input,select,textarea{-webkit-tap-highlight-color:transparent;}
button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible{
  outline:2px solid #f1d98b!important;
  outline-offset:2px!important;
  box-shadow:var(--td-focus)!important;
}
button:disabled{cursor:not-allowed!important;opacity:.55!important;transform:none!important;filter:none!important;}
img{max-width:100%;}

/* Auth/loading: an opaque single state, never the page underneath. */
body.auth-loading{overflow:hidden!important;}
body.auth-loading > *:not(#loadingScreen):not(.loading-screen):not(script):not(style):not(link){
  visibility:hidden!important;
  opacity:0!important;
  pointer-events:none!important;
}
body.auth-loading #loadingScreen,
body.auth-loading > .loading-screen{
  display:flex!important;
  visibility:visible!important;
  opacity:1!important;
  pointer-events:auto!important;
}
body.td-login-mode{overflow:hidden!important;}
body.td-login-mode > *:not(#authScreen):not(.auth-screen):not(script):not(style):not(link){
  visibility:hidden!important;
  opacity:0!important;
  pointer-events:none!important;
}
body.td-login-mode #authScreen,
body.td-login-mode > .auth-screen{
  display:flex!important;
  visibility:visible!important;
  opacity:1!important;
  pointer-events:auto!important;
}
.loading-screen,.auth-screen{
  position:fixed!important;
  inset:0!important;
  width:100vw!important;
  min-height:100dvh!important;
  z-index:100000!important;
  align-items:center!important;
  justify-content:center!important;
  padding:20px!important;
  background:
    radial-gradient(circle at 50% 5%,rgba(143,23,23,.35),transparent 38%),
    linear-gradient(145deg,#060606,#11100e 58%,#070707)!important;
}
.loading-box,.auth-box{width:min(420px,100%)!important;padding:28px!important;text-align:center!important;}
.loading-box .spinner{margin:0 auto 16px!important;}
.auth-box input{min-height:48px!important;margin-top:10px!important;}
.auth-box button{min-height:48px!important;margin-top:12px!important;width:100%!important;}
.auth-error{min-height:22px!important;margin-top:10px!important;color:#ff8a8a!important;font-weight:700!important;}

/* Unified desktop shell. */
@media (min-width:921px){
  body.td-app-ready{padding:0!important;min-height:100vh!important;}
  body.td-app-ready > .header{display:none!important;}
  .td-final-header{
    position:fixed!important;
    inset:0 0 auto 0!important;
    width:100%!important;
    height:var(--td-shell-header)!important;
    min-height:var(--td-shell-header)!important;
    display:flex!important;
    align-items:center!important;
    gap:18px!important;
    padding:16px 30px!important;
    z-index:30000!important;
    border-bottom:1px solid rgba(148,15,18,.95)!important;
    background:linear-gradient(90deg,#050505 0%,#160b08 24%,#40170f 50%,#160b08 76%,#050505 100%)!important;
    box-shadow:0 16px 38px rgba(0,0,0,.52)!important;
    box-sizing:border-box!important;
  }
  .td-final-header-logo{width:58px!important;height:58px!important;object-fit:contain!important;filter:drop-shadow(0 9px 18px rgba(0,0,0,.5))!important;}
  .td-final-brand-block{min-width:0!important;}
  .td-final-brand-title{font-size:30px!important;line-height:1!important;font-weight:950!important;letter-spacing:.09em!important;color:#f7f1e4!important;}
  .td-final-brand-subtitle{margin-top:9px!important;font-size:11px!important;font-weight:800!important;letter-spacing:.18em!important;color:#d8b55a!important;}

  #sideMenu.td-final-sidebar{
    position:fixed!important;
    top:var(--td-shell-header)!important;
    left:0!important;
    bottom:0!important;
    width:var(--td-shell-sidebar)!important;
    height:auto!important;
    margin:0!important;
    padding:22px 14px!important;
    display:flex!important;
    flex-direction:column!important;
    gap:8px!important;
    overflow-y:auto!important;
    transform:none!important;
    z-index:29000!important;
    border:0!important;
    border-right:1px solid rgba(216,181,90,.15)!important;
    border-radius:0!important;
    background:linear-gradient(180deg,rgba(17,15,12,.99),rgba(7,7,7,.99))!important;
    box-shadow:16px 0 40px rgba(0,0,0,.28)!important;
  }
  #sideMenu.td-final-sidebar h3{display:none!important;}
  #sideMenu.td-final-sidebar button{
    width:100%!important;
    min-height:48px!important;
    padding:0 15px!important;
    display:grid!important;
    grid-template-columns:28px 1fr!important;
    align-items:center!important;
    gap:10px!important;
    text-align:left!important;
    color:#e9e0cf!important;
    background:transparent!important;
    border:1px solid transparent!important;
    border-radius:14px!important;
    box-shadow:none!important;
    font-size:14px!important;
  }
  #sideMenu.td-final-sidebar button:hover{background:rgba(216,181,90,.08)!important;border-color:rgba(216,181,90,.12)!important;}
  #sideMenu.td-final-sidebar button.active,
  #sideMenu.td-final-sidebar button.td-active{
    color:#fff7df!important;
    background:linear-gradient(135deg,rgba(148,15,18,.82),rgba(79,12,12,.92))!important;
    border-color:rgba(216,181,90,.34)!important;
    box-shadow:0 10px 24px rgba(0,0,0,.28)!important;
  }

  body.td-app-ready > :is(.container,.album-wrap,main.page,#page,#profilePage,.profile-wrap){
    width:auto!important;
    max-width:none!important;
    margin:calc(var(--td-shell-header) + var(--td-shell-gap)) var(--td-shell-gap) 48px calc(var(--td-shell-sidebar) + var(--td-shell-gap))!important;
    padding:0!important;
    box-sizing:border-box!important;
  }
  body.td-app-ready > #page.hidden{display:none!important;}
  body.td-app-ready > #page:not(.hidden){display:block!important;}
  body.td-app-ready .profile-account{display:none!important;}
  #tdNativeNav{display:none!important;}
}

/* Common content rhythm. */
body.td-app-ready :is(.form-section,.stats-section,.panel,.card,.hero,.post,.album-top,.profile-card,.profile-section){
  border-radius:var(--td-radius-lg)!important;
}
body.td-app-ready :is(.form-section,.stats-section,.panel,.card,.hero){padding:20px!important;}
body.td-app-ready :is(h1,h2,h3){text-wrap:balance;}
body.td-app-ready :is(input,select,textarea){min-height:46px!important;}
body.td-app-ready textarea{line-height:1.5!important;}
body.td-app-ready button{min-height:42px;}
.empty{min-height:112px!important;display:flex;align-items:center;justify-content:center;line-height:1.55!important;}

/* Card/image stability: reserve space and avoid jumps. */
.post-img,.public-post-card img,.public-card img,.result-card img,.deck-card-row img,.album-card img,.card-image img{
  background:#0a0a0a!important;
}
.post-img{width:100%!important;max-height:520px!important;object-fit:contain!important;}
.album-card,.result-card,.deck-card-row,.post{contain:layout paint;}

/* Community: compact, stable actions and filters. */
.community-page .filters-wrap{position:sticky;top:8px;z-index:20;padding:8px 0 12px;background:linear-gradient(180deg,rgba(7,7,7,.96),rgba(7,7,7,.72),transparent)!important;backdrop-filter:blur(10px);}
.community-page .post-actions{display:flex!important;gap:9px!important;flex-wrap:wrap!important;}
.community-page .post-actions button{min-width:112px!important;}
.community-page .comments{scroll-margin-top:110px;}
.community-page .comment-row{display:grid!important;grid-template-columns:minmax(0,1fr) auto!important;gap:8px!important;align-items:end!important;}
.community-page .author{border:0!important;background:transparent!important;box-shadow:none!important;padding:0!important;min-height:0!important;color:#f7f1e4!important;}

/* Modals: one consistent overlay and internal scrolling. */
body.td-modal-open{overflow:hidden!important;}
.modal,.password-modal,.manual-upload-modal,.policy-modal,.adjust-modal,.viewer,.crop-modal{
  overscroll-behavior:contain!important;
}
.modal-card,.password-box,.manual-upload-box,.policy-card,.adjust-card,.viewer-card,.crop-card{
  max-height:min(88dvh,900px)!important;
  overflow:auto!important;
  overscroll-behavior:contain!important;
}

/* Mobile shell. */
@media (max-width:920px){
  :root{--td-mobile-nav:74px;}
  body.td-app-ready{padding:8px 8px calc(var(--td-mobile-nav) + 18px + env(safe-area-inset-bottom))!important;}
  .td-final-header,#sideMenu.td-final-sidebar{display:none!important;}
  body.td-app-ready > .header{
    position:sticky!important;
    top:6px!important;
    z-index:5000!important;
    width:100%!important;
    min-height:62px!important;
    margin:0 0 14px!important;
    padding:9px 58px!important;
    border-radius:18px!important;
    overflow:hidden!important;
    backdrop-filter:blur(16px)!important;
  }
  body.td-app-ready > .header .pokemon-title{
    max-width:100%!important;
    overflow:hidden!important;
    text-overflow:ellipsis!important;
    white-space:nowrap!important;
    font-size:clamp(18px,6vw,24px)!important;
    letter-spacing:.035em!important;
  }
  body.td-app-ready > .header .poke-icon{width:34px!important;height:34px!important;min-width:34px!important;}
  body.td-app-ready > .header .poke-icon:last-child{display:none!important;}
  body.td-app-ready > :is(.container,.album-wrap,main.page,#page,#profilePage,.profile-wrap){
    width:100%!important;
    max-width:100%!important;
    margin:0!important;
    padding:0!important;
    box-sizing:border-box!important;
  }
  body.td-app-ready > #page.hidden{display:none!important;}
  .bottom-glass,.mobile-bottom-nav,.td-mobile-bottom-nav,.fabio-mobile-nav,.quick-mobile-nav,.td-fast-mobile-nav{display:none!important;}
  #tdNativeNav{
    position:fixed!important;
    left:8px!important;
    right:8px!important;
    bottom:max(8px,env(safe-area-inset-bottom))!important;
    height:var(--td-mobile-nav)!important;
    display:grid!important;
    grid-template-columns:repeat(5,minmax(0,1fr))!important;
    align-items:center!important;
    gap:3px!important;
    padding:7px!important;
    z-index:40000!important;
    border:1px solid rgba(216,181,90,.18)!important;
    border-radius:22px!important;
    background:rgba(10,9,8,.94)!important;
    box-shadow:0 14px 38px rgba(0,0,0,.52)!important;
    backdrop-filter:blur(18px)!important;
  }
  #tdNativeNav a{
    min-width:0!important;
    height:58px!important;
    display:flex!important;
    flex-direction:column!important;
    align-items:center!important;
    justify-content:center!important;
    gap:3px!important;
    padding:4px 2px!important;
    border-radius:15px!important;
    color:#aaa292!important;
    text-decoration:none!important;
    font-size:10px!important;
    font-weight:800!important;
    line-height:1!important;
    overflow:hidden!important;
  }
  #tdNativeNav a .td-nav-ico{font-size:20px!important;line-height:1!important;}
  #tdNativeNav a.active{color:#fff4d2!important;background:rgba(148,15,18,.42)!important;}
  #tdNativeNav a.add{
    width:52px!important;
    height:52px!important;
    justify-self:center!important;
    margin-top:-20px!important;
    border-radius:18px!important;
    color:#160d05!important;
    background:linear-gradient(135deg,#f1d98b,#d8b55a 52%,#9c7026)!important;
    box-shadow:0 12px 28px rgba(0,0,0,.46)!important;
  }
  #tdNativeNav a.add .td-nav-ico{font-size:28px!important;}
  #tdNativeNav a.add span:last-child{font-size:9px!important;}
  .profile-account{top:17px!important;right:15px!important;z-index:7000!important;}
  .profile-btn{width:38px!important;height:38px!important;min-width:38px!important;border-radius:13px!important;}
  .album-actions,.header-actions,.actions{gap:8px!important;}
  .album-actions button,.header-actions button{min-width:0!important;flex:1 1 150px!important;}
  .grid{grid-template-columns:1fr!important;}
  .community-page .filters-wrap{top:0;}
}

@media (max-width:520px){
  body.td-app-ready{padding-left:6px!important;padding-right:6px!important;}
  body.td-app-ready > .header{top:4px!important;min-height:58px!important;padding:8px 52px!important;border-radius:16px!important;}
  body.td-app-ready > .header .pokemon-title{font-size:clamp(17px,5.8vw,22px)!important;}
  body.td-app-ready :is(.form-section,.stats-section,.panel,.card,.hero){padding:15px!important;border-radius:19px!important;}
  .community-page .post{padding:14px!important;border-radius:20px!important;}
  .community-page .post-actions button{min-width:0!important;flex:1 1 105px!important;}
  .community-page .comment-row{grid-template-columns:1fr!important;}
  .community-page .comment-row button{width:100%!important;}
  .deck-fields{grid-template-columns:1fr!important;}
  #tdNativeNav{left:5px!important;right:5px!important;padding:6px 4px!important;}
  #tdNativeNav a{font-size:9px!important;}
}

@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{scroll-behavior:auto!important;animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important;}
}

/* V0.1.29 — single authoritative mobile navigation and loading component. */
.td-loading-logo{
  display:block!important;
  width:72px!important;
  height:72px!important;
  object-fit:contain!important;
  margin:0 auto 18px!important;
  filter:drop-shadow(0 8px 18px rgba(0,0,0,.42))!important;
}
body.auth-loading #loadingScreen.loading-screen,
body.auth-loading > .loading-screen,
html.td-fast-auth body.auth-loading #loadingScreen.loading-screen{
  position:fixed!important;
  inset:0!important;
  width:100vw!important;
  height:100dvh!important;
  min-height:100dvh!important;
  margin:0!important;
  padding:18px!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  overflow:hidden!important;
  box-sizing:border-box!important;
  background:radial-gradient(circle at 50% 12%,rgba(137,20,20,.24),transparent 34%),linear-gradient(160deg,#151515,#070707 66%,#030303)!important;
  z-index:2147483000!important;
}
body.auth-loading #loadingScreen > .loading-box,
body.auth-loading #loadingScreen > .loading-card,
body.auth-loading > .loading-screen > .loading-box,
body.auth-loading > .loading-screen > .loading-card{
  width:min(360px,calc(100vw - 36px))!important;
  max-width:360px!important;
  min-width:0!important;
  margin:0!important;
  padding:28px 24px!important;
  border:1px solid rgba(216,181,90,.34)!important;
  border-radius:24px!important;
  box-sizing:border-box!important;
  text-align:center!important;
  background:linear-gradient(180deg,rgba(35,30,23,.98),rgba(16,16,16,.99))!important;
  box-shadow:0 24px 58px rgba(0,0,0,.58),inset 0 1px 0 rgba(255,255,255,.04)!important;
  transform:none!important;
}
body.auth-loading #loadingScreen .spinner,
body.auth-loading > .loading-screen .spinner{
  width:34px!important;
  height:34px!important;
  margin:0 auto 17px!important;
  border-width:3px!important;
  border-color:rgba(216,181,90,.20)!important;
  border-top-color:#e1bd55!important;
  animation:spin .68s linear infinite!important;
}
body.auth-loading #loadingScreen .loading-title,
body.auth-loading > .loading-screen .loading-title{
  margin:0!important;
  color:#f1d98b!important;
  font-size:24px!important;
  line-height:1.1!important;
  font-weight:950!important;
}
body.auth-loading #loadingScreen .loading-text,
body.auth-loading > .loading-screen .loading-text{
  margin:10px 0 0!important;
  color:#c4beb1!important;
  font-size:14px!important;
  line-height:1.35!important;
}

@media (max-width:920px){
  body.td-app-ready,
  body:not(.auth-loading):not(.auth-active):not(.td-login-mode){
    padding-bottom:calc(98px + env(safe-area-inset-bottom))!important;
  }

  body.td-app-ready #tdNativeNav.td-nav-ready,
  body.td-app-ready .td-native-nav.td-nav-ready,
  body:not(.auth-loading):not(.auth-active):not(.td-login-mode) #tdNativeNav.td-nav-ready,
  body:not(.auth-loading):not(.auth-active):not(.td-login-mode) .td-native-nav.td-nav-ready{
    display:grid!important;
    visibility:visible!important;
    opacity:1!important;
    pointer-events:auto!important;
    position:fixed!important;
    left:50%!important;
    right:auto!important;
    bottom:calc(10px + env(safe-area-inset-bottom))!important;
    transform:translateX(-50%)!important;
    width:calc(100vw - 20px)!important;
    max-width:460px!important;
    min-width:0!important;
    height:74px!important;
    margin:0!important;
    padding:7px 8px!important;
    box-sizing:border-box!important;
    grid-template-columns:repeat(5,minmax(0,1fr))!important;
    align-items:center!important;
    justify-items:center!important;
    gap:0!important;
    border:1px solid rgba(216,181,90,.34)!important;
    border-radius:28px!important;
    overflow:visible!important;
    z-index:40000!important;
    background:rgba(9,8,7,.96)!important;
    box-shadow:0 -12px 34px rgba(0,0,0,.50),inset 0 1px 0 rgba(255,255,255,.06)!important;
    backdrop-filter:blur(18px)!important;
    -webkit-backdrop-filter:blur(18px)!important;
  }

  body.td-app-ready #tdNativeNav.td-nav-ready a,
  body.td-app-ready .td-native-nav.td-nav-ready a,
  body:not(.auth-loading):not(.auth-active):not(.td-login-mode) #tdNativeNav.td-nav-ready a,
  body:not(.auth-loading):not(.auth-active):not(.td-login-mode) .td-native-nav.td-nav-ready a{
    width:100%!important;
    min-width:0!important;
    max-width:100%!important;
    height:60px!important;
    margin:0!important;
    padding:4px 1px!important;
    display:flex!important;
    flex-direction:column!important;
    align-items:center!important;
    justify-content:center!important;
    gap:4px!important;
    box-sizing:border-box!important;
    border-radius:19px!important;
    overflow:hidden!important;
    transform:none!important;
    color:#f4f0e5!important;
    text-align:center!important;
    text-decoration:none!important;
    white-space:nowrap!important;
    font-size:9.2px!important;
    line-height:1!important;
    font-weight:950!important;
    letter-spacing:-.45px!important;
  }

  body.td-app-ready #tdNativeNav.td-nav-ready a span,
  body.td-app-ready .td-native-nav.td-nav-ready a span,
  body:not(.auth-loading):not(.auth-active):not(.td-login-mode) #tdNativeNav.td-nav-ready a span,
  body:not(.auth-loading):not(.auth-active):not(.td-login-mode) .td-native-nav.td-nav-ready a span{
    display:block!important;
    width:100%!important;
    text-align:center!important;
    overflow:hidden!important;
    white-space:nowrap!important;
  }

  body.td-app-ready #tdNativeNav.td-nav-ready .td-nav-ico,
  body.td-app-ready .td-native-nav.td-nav-ready .td-nav-ico,
  body:not(.auth-loading):not(.auth-active):not(.td-login-mode) #tdNativeNav.td-nav-ready .td-nav-ico,
  body:not(.auth-loading):not(.auth-active):not(.td-login-mode) .td-native-nav.td-nav-ready .td-nav-ico{
    width:100%!important;
    margin:0!important;
    font-size:21px!important;
    line-height:1!important;
    text-align:center!important;
  }

  body.td-app-ready #tdNativeNav.td-nav-ready a.active:not(.add),
  body.td-app-ready .td-native-nav.td-nav-ready a.active:not(.add),
  body:not(.auth-loading):not(.auth-active):not(.td-login-mode) #tdNativeNav.td-nav-ready a.active:not(.add),
  body:not(.auth-loading):not(.auth-active):not(.td-login-mode) .td-native-nav.td-nav-ready a.active:not(.add){
    color:#fff2cd!important;
    background:linear-gradient(135deg,rgba(133,8,12,.94),rgba(79,4,7,.92))!important;
  }

  body.td-app-ready #tdNativeNav.td-nav-ready a.add,
  body.td-app-ready .td-native-nav.td-nav-ready a.add,
  body:not(.auth-loading):not(.auth-active):not(.td-login-mode) #tdNativeNav.td-nav-ready a.add,
  body:not(.auth-loading):not(.auth-active):not(.td-login-mode) .td-native-nav.td-nav-ready a.add{
    width:58px!important;
    height:58px!important;
    min-width:58px!important;
    max-width:58px!important;
    aspect-ratio:1/1!important;
    justify-self:center!important;
    align-self:center!important;
    margin:0!important;
    padding:5px 2px!important;
    border:1.5px solid rgba(4,4,4,.94)!important;
    border-radius:50%!important;
    overflow:hidden!important;
    color:#050505!important;
    background:linear-gradient(180deg,#ffe866 0%,#ffd21a 52%,#ffc400 100%)!important;
    box-shadow:0 0 18px rgba(255,207,25,.32),0 6px 16px rgba(0,0,0,.42),inset 0 1px 0 rgba(255,255,255,.45)!important;
  }

  body.td-app-ready #tdNativeNav.td-nav-ready a.add .td-nav-ico,
  body.td-app-ready .td-native-nav.td-nav-ready a.add .td-nav-ico,
  body:not(.auth-loading):not(.auth-active):not(.td-login-mode) #tdNativeNav.td-nav-ready a.add .td-nav-ico,
  body:not(.auth-loading):not(.auth-active):not(.td-login-mode) .td-native-nav.td-nav-ready a.add .td-nav-ico{
    font-size:27px!important;
    line-height:.88!important;
    font-weight:1000!important;
  }

  body.td-app-ready #tdNativeNav.td-nav-ready a.add span:last-child,
  body.td-app-ready .td-native-nav.td-nav-ready a.add span:last-child,
  body:not(.auth-loading):not(.auth-active):not(.td-login-mode) #tdNativeNav.td-nav-ready a.add span:last-child,
  body:not(.auth-loading):not(.auth-active):not(.td-login-mode) .td-native-nav.td-nav-ready a.add span:last-child{
    font-size:8.8px!important;
    letter-spacing:-.55px!important;
  }

  body.auth-loading #tdNativeNav,
  body.auth-loading .td-native-nav,
  body.auth-active #tdNativeNav,
  body.auth-active .td-native-nav,
  body.td-login-mode #tdNativeNav,
  body.td-login-mode .td-native-nav{
    display:none!important;
    visibility:hidden!important;
    opacity:0!important;
    pointer-events:none!important;
  }
}

@media (max-width:370px){
  body.td-app-ready #tdNativeNav.td-nav-ready,
  body.td-app-ready .td-native-nav.td-nav-ready{
    width:calc(100vw - 10px)!important;
    padding-left:5px!important;
    padding-right:5px!important;
  }
  body.td-app-ready #tdNativeNav.td-nav-ready a,
  body.td-app-ready .td-native-nav.td-nav-ready a{
    font-size:8.4px!important;
    letter-spacing:-.6px!important;
  }
}

/* V0.1.30 — prevent the legacy premium loader logo from duplicating the shared logo. */
.loading-box::before{
  content:none!important;
  display:none!important;
  width:0!important;
  height:0!important;
  margin:0!important;
  background:none!important;
}