/*
 * Account & App Experience v1
 * 2026-09-19 — modern-only polish for account/profile/PWA surfaces.
 * Gameplay and Classic mode intentionally untouched.
 */

:root[data-ui-mode="modern"] .platform-home:is(.fbrkh-next-shell,.approved-reference-home,.home-r765-exact,.home-r783-interactive,.home-r792-approved-interactive){
  --acct-panel:rgba(26,14,47,.94);
  --acct-panel-soft:rgba(255,255,255,.045);
  --acct-line:rgba(255,255,255,.09);
  --acct-line-hot:rgba(174,111,255,.34);
  --acct-gold:#ffd76f;
  --acct-muted:#c8bfd4;
}

:root[data-ui-mode="modern"] .platform-home:is(.fbrkh-next-shell,.approved-reference-home,.home-r765-exact,.home-r783-interactive,.home-r792-approved-interactive) #authModal{
  align-items:center!important;
  padding:max(14px,env(safe-area-inset-top)) 14px max(14px,env(safe-area-inset-bottom))!important;
}
:root[data-ui-mode="modern"] .platform-home:is(.fbrkh-next-shell,.approved-reference-home,.home-r765-exact,.home-r783-interactive,.home-r792-approved-interactive) #authModal .modal-card{
  scrollbar-width:thin;
  scrollbar-color:rgba(177,112,255,.42) transparent;
}
:root[data-ui-mode="modern"] .platform-home:is(.fbrkh-next-shell,.approved-reference-home,.home-r765-exact,.home-r783-interactive,.home-r792-approved-interactive) #authModal .modal-x{
  width:42px!important;height:42px!important;
  display:grid!important;place-items:center!important;
  border:1px solid var(--acct-line)!important;
  border-radius:14px!important;
  background:rgba(255,255,255,.045)!important;
  color:#fff!important;
}
:root[data-ui-mode="modern"] .platform-home:is(.fbrkh-next-shell,.approved-reference-home,.home-r765-exact,.home-r783-interactive,.home-r792-approved-interactive) #authContent[data-next-account="1"]>h2{
  margin:2px 0 7px!important;
  font-size:clamp(28px,4vw,36px)!important;
  letter-spacing:-.035em;
}
:root[data-ui-mode="modern"] .platform-home:is(.fbrkh-next-shell,.approved-reference-home,.home-r765-exact,.home-r783-interactive,.home-r792-approved-interactive) #authContent[data-next-account="1"]>p{
  color:var(--acct-muted)!important;
  line-height:1.75!important;
}
:root[data-ui-mode="modern"] .platform-home:is(.fbrkh-next-shell,.approved-reference-home,.home-r765-exact,.home-r783-interactive,.home-r792-approved-interactive) #accountAuthForm{
  gap:10px!important;
}
:root[data-ui-mode="modern"] .platform-home:is(.fbrkh-next-shell,.approved-reference-home,.home-r765-exact,.home-r783-interactive,.home-r792-approved-interactive) #accountAuthForm input{
  min-height:52px!important;
  padding:0 15px!important;
  transition:border-color .18s ease,box-shadow .18s ease,background .18s ease;
}
:root[data-ui-mode="modern"] .platform-home:is(.fbrkh-next-shell,.approved-reference-home,.home-r765-exact,.home-r783-interactive,.home-r792-approved-interactive) #accountAuthForm input:focus{
  outline:none!important;
  border-color:var(--acct-line-hot)!important;
  background:rgba(255,255,255,.065)!important;
  box-shadow:0 0 0 4px rgba(155,88,255,.10)!important;
}
:root[data-ui-mode="modern"] .platform-home:is(.fbrkh-next-shell,.approved-reference-home,.home-r765-exact,.home-r783-interactive,.home-r792-approved-interactive) #accountAuthForm .btn{
  min-height:50px!important;
  border-radius:15px!important;
}
:root[data-ui-mode="modern"] .platform-home:is(.fbrkh-next-shell,.approved-reference-home,.home-r765-exact,.home-r783-interactive,.home-r792-approved-interactive) #accountAuthForm .text-link{
  min-height:42px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  border-radius:12px;
}
:root[data-ui-mode="modern"] .platform-home:is(.fbrkh-next-shell,.approved-reference-home,.home-r765-exact,.home-r783-interactive,.home-r792-approved-interactive) #authStatus{
  min-height:1.5em;
  display:block;
  color:#f5d98b!important;
  line-height:1.55;
}

:root[data-ui-mode="modern"] .platform-home:is(.fbrkh-next-shell,.approved-reference-home,.home-r765-exact,.home-r783-interactive,.home-r792-approved-interactive) .platform-profile-hero{
  min-height:98px;
  padding:15px!important;
  gap:16px!important;
  border-color:var(--acct-line)!important;
  background:
    radial-gradient(circle at 12% 12%,rgba(255,215,111,.08),transparent 8rem),
    rgba(255,255,255,.035)!important;
}
:root[data-ui-mode="modern"] .platform-home:is(.fbrkh-next-shell,.approved-reference-home,.home-r765-exact,.home-r783-interactive,.home-r792-approved-interactive) .platform-profile-hero h2{
  margin:2px 0 4px!important;
  font-size:clamp(24px,4vw,31px)!important;
}
:root[data-ui-mode="modern"] .platform-home:is(.fbrkh-next-shell,.approved-reference-home,.home-r765-exact,.home-r783-interactive,.home-r792-approved-interactive) .platform-profile-hero small{
  color:var(--acct-gold)!important;
  font-weight:900;
}
:root[data-ui-mode="modern"] .platform-home:is(.fbrkh-next-shell,.approved-reference-home,.home-r765-exact,.home-r783-interactive,.home-r792-approved-interactive) .account-photo-button{
  min-height:50px!important;
  margin:8px 0 10px!important;
  border-radius:15px!important;
}
:root[data-ui-mode="modern"] .platform-home:is(.fbrkh-next-shell,.approved-reference-home,.home-r765-exact,.home-r783-interactive,.home-r792-approved-interactive) .account-hint{
  margin:0 0 12px!important;
  padding:12px 13px!important;
  border:1px solid rgba(255,255,255,.065);
  border-radius:14px!important;
  background:rgba(255,255,255,.025)!important;
  color:var(--acct-muted)!important;
}
:root[data-ui-mode="modern"] .platform-home:is(.fbrkh-next-shell,.approved-reference-home,.home-r765-exact,.home-r783-interactive,.home-r792-approved-interactive) .notification-settings{
  margin:12px 0!important;
  padding:15px!important;
  border-color:var(--acct-line)!important;
  border-radius:18px!important;
}
:root[data-ui-mode="modern"] .platform-home:is(.fbrkh-next-shell,.approved-reference-home,.home-r765-exact,.home-r783-interactive,.home-r792-approved-interactive) .notification-settings h3{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  font-size:17px;
}
:root[data-ui-mode="modern"] .platform-home:is(.fbrkh-next-shell,.approved-reference-home,.home-r765-exact,.home-r783-interactive,.home-r792-approved-interactive) .notification-toggle{
  min-height:46px;
  padding:9px 10px;
  border:1px solid rgba(255,255,255,.06);
  border-radius:13px;
  background:rgba(255,255,255,.025);
  color:#f3edf7;
}
:root[data-ui-mode="modern"] .platform-home:is(.fbrkh-next-shell,.approved-reference-home,.home-r765-exact,.home-r783-interactive,.home-r792-approved-interactive) .notification-toggle input{
  flex:0 0 auto;
}
:root[data-ui-mode="modern"] .platform-home:is(.fbrkh-next-shell,.approved-reference-home,.home-r765-exact,.home-r783-interactive,.home-r792-approved-interactive) #logoutBtn{
  width:100%;
  min-height:46px;
  border-radius:14px!important;
}

:root[data-ui-mode="modern"] .platform-home:is(.fbrkh-next-shell,.approved-reference-home,.home-r765-exact,.home-r783-interactive,.home-r792-approved-interactive) .fbrkh-profile-modal{
  background:rgba(5,2,10,.76)!important;
  backdrop-filter:blur(16px)!important;
}
:root[data-ui-mode="modern"] .platform-home:is(.fbrkh-next-shell,.approved-reference-home,.home-r765-exact,.home-r783-interactive,.home-r792-approved-interactive) .fbrkh-profile-card{
  width:min(620px,calc(100% - 24px))!important;
  max-height:min(820px,calc(100svh - 24px))!important;
  overflow:auto!important;
  padding:24px!important;
  border:1px solid var(--acct-line)!important;
  border-radius:28px!important;
  background:
    radial-gradient(circle at 82% 0,rgba(155,88,255,.16),transparent 18rem),
    linear-gradient(180deg,rgba(31,16,54,.985),rgba(13,7,25,.985))!important;
  box-shadow:0 34px 100px rgba(0,0,0,.58)!important;
}
:root[data-ui-mode="modern"] .platform-home:is(.fbrkh-next-shell,.approved-reference-home,.home-r765-exact,.home-r783-interactive,.home-r792-approved-interactive) .fbrkh-profile-heading{
  display:grid!important;
  grid-template-columns:auto minmax(0,1fr)!important;
  align-items:center!important;
  gap:15px!important;
}
:root[data-ui-mode="modern"] .platform-home:is(.fbrkh-next-shell,.approved-reference-home,.home-r765-exact,.home-r783-interactive,.home-r792-approved-interactive) .fbrkh-profile-preview{
  border-radius:22px!important;
  box-shadow:0 0 0 3px rgba(155,88,255,.18),0 14px 36px rgba(0,0,0,.24);
}
:root[data-ui-mode="modern"] .platform-home:is(.fbrkh-next-shell,.approved-reference-home,.home-r765-exact,.home-r783-interactive,.home-r792-approved-interactive) :is(.fbrkh-name-field input,.fbrkh-profile-card select){
  min-height:50px!important;
  border:1px solid var(--acct-line)!important;
  border-radius:14px!important;
  background:rgba(255,255,255,.045)!important;
  color:#fff!important;
}
:root[data-ui-mode="modern"] .platform-home:is(.fbrkh-next-shell,.approved-reference-home,.home-r765-exact,.home-r783-interactive,.home-r792-approved-interactive) .fbrkh-profile-tabs{
  padding:4px!important;
  border:1px solid var(--acct-line)!important;
  border-radius:15px!important;
  background:rgba(255,255,255,.03)!important;
}
:root[data-ui-mode="modern"] .platform-home:is(.fbrkh-next-shell,.approved-reference-home,.home-r765-exact,.home-r783-interactive,.home-r792-approved-interactive) .fbrkh-profile-tabs button{
  min-height:44px;
  border-radius:11px!important;
}
:root[data-ui-mode="modern"] .platform-home:is(.fbrkh-next-shell,.approved-reference-home,.home-r765-exact,.home-r783-interactive,.home-r792-approved-interactive) .fbrkh-profile-tabs button.active{
  background:linear-gradient(135deg,#9b58ff,#6d2dde)!important;
  color:#fff!important;
}
:root[data-ui-mode="modern"] .platform-home:is(.fbrkh-next-shell,.approved-reference-home,.home-r765-exact,.home-r783-interactive,.home-r792-approved-interactive) .fbrkh-avatar-grid{
  gap:9px!important;
}
:root[data-ui-mode="modern"] .platform-home:is(.fbrkh-next-shell,.approved-reference-home,.home-r765-exact,.home-r783-interactive,.home-r792-approved-interactive) .fbrkh-avatar-grid button{
  border-radius:16px!important;
  transition:transform .16s ease,border-color .16s ease,box-shadow .16s ease;
}
:root[data-ui-mode="modern"] .platform-home:is(.fbrkh-next-shell,.approved-reference-home,.home-r765-exact,.home-r783-interactive,.home-r792-approved-interactive) .fbrkh-avatar-grid button:hover{
  transform:translateY(-2px);
}
:root[data-ui-mode="modern"] .platform-home:is(.fbrkh-next-shell,.approved-reference-home,.home-r765-exact,.home-r783-interactive,.home-r792-approved-interactive) #fbrkhSaveProfile{
  min-height:50px!important;
  border-radius:15px!important;
}

:root[data-ui-mode="modern"] .platform-home:is(.fbrkh-next-shell,.approved-reference-home,.home-r765-exact,.home-r783-interactive,.home-r792-approved-interactive) #installFbrkh{
  width:min(1260px,calc(100% - 28px));
  margin:18px auto 0!important;
  padding:0!important;
}
:root[data-ui-mode="modern"] .platform-home:is(.fbrkh-next-shell,.approved-reference-home,.home-r765-exact,.home-r783-interactive,.home-r792-approved-interactive) #installFbrkh .install-card{
  position:relative;
  overflow:hidden;
  min-height:150px;
  display:grid!important;
  grid-template-columns:minmax(0,1fr) auto!important;
  align-items:center!important;
  gap:24px!important;
  padding:24px 26px!important;
  border-radius:26px!important;
  border-color:rgba(255,215,111,.16)!important;
  background:
    radial-gradient(circle at 92% 20%,rgba(255,215,111,.10),transparent 16rem),
    linear-gradient(135deg,rgba(35,17,59,.92),rgba(14,8,27,.92))!important;
}
:root[data-ui-mode="modern"] .platform-home:is(.fbrkh-next-shell,.approved-reference-home,.home-r765-exact,.home-r783-interactive,.home-r792-approved-interactive) #installFbrkh .install-card::after{
  content:"＋";
  position:absolute;
  left:22px;
  bottom:-28px;
  font:900 118px/.8 Arial,sans-serif;
  color:rgba(255,255,255,.025);
  pointer-events:none;
}
:root[data-ui-mode="modern"] .platform-home:is(.fbrkh-next-shell,.approved-reference-home,.home-r765-exact,.home-r783-interactive,.home-r792-approved-interactive) #installFbrkh .install-card h2{
  font-size:clamp(24px,3.2vw,36px)!important;
  margin:4px 0 8px!important;
}
:root[data-ui-mode="modern"] .platform-home:is(.fbrkh-next-shell,.approved-reference-home,.home-r765-exact,.home-r783-interactive,.home-r792-approved-interactive) #installFbrkh .install-card p{
  max-width:720px;
}
:root[data-ui-mode="modern"] .platform-home:is(.fbrkh-next-shell,.approved-reference-home,.home-r765-exact,.home-r783-interactive,.home-r792-approved-interactive) #pwaInstallBtn{
  min-height:50px!important;
  max-width:260px;
  white-space:normal;
  border-radius:15px!important;
}
:root[data-ui-mode="modern"] .platform-home:is(.fbrkh-next-shell,.approved-reference-home,.home-r765-exact,.home-r783-interactive,.home-r792-approved-interactive) #installFbrkh[data-install-method="ios-share"] #pwaInstallBtn::before{
  content:"↗";
  margin-inline-end:7px;
}

@media(max-width:640px){
  :root[data-ui-mode="modern"] .platform-home:is(.fbrkh-next-shell,.approved-reference-home,.home-r765-exact,.home-r783-interactive,.home-r792-approved-interactive) #authModal{
    align-items:flex-end!important;
    padding:8px!important;
  }
  :root[data-ui-mode="modern"] .platform-home:is(.fbrkh-next-shell,.approved-reference-home,.home-r765-exact,.home-r783-interactive,.home-r792-approved-interactive) #authModal .modal-card{
    width:100%!important;
    max-height:calc(100svh - 12px)!important;
    padding:22px 16px max(18px,env(safe-area-inset-bottom))!important;
    border-radius:26px 26px 18px 18px!important;
  }
  :root[data-ui-mode="modern"] .platform-home:is(.fbrkh-next-shell,.approved-reference-home,.home-r765-exact,.home-r783-interactive,.home-r792-approved-interactive) .fbrkh-profile-card{
    width:100%!important;
    max-height:calc(100svh - 12px)!important;
    padding:20px 14px max(18px,env(safe-area-inset-bottom))!important;
    border-radius:26px 26px 18px 18px!important;
  }
  :root[data-ui-mode="modern"] .platform-home:is(.fbrkh-next-shell,.approved-reference-home,.home-r765-exact,.home-r783-interactive,.home-r792-approved-interactive) .fbrkh-profile-heading{
    grid-template-columns:72px minmax(0,1fr)!important;
  }
  :root[data-ui-mode="modern"] .platform-home:is(.fbrkh-next-shell,.approved-reference-home,.home-r765-exact,.home-r783-interactive,.home-r792-approved-interactive) #installFbrkh{
    width:calc(100% - 16px);
  }
  :root[data-ui-mode="modern"] .platform-home:is(.fbrkh-next-shell,.approved-reference-home,.home-r765-exact,.home-r783-interactive,.home-r792-approved-interactive) #installFbrkh .install-card{
    grid-template-columns:1fr!important;
    gap:16px!important;
    padding:20px!important;
  }
  :root[data-ui-mode="modern"] .platform-home:is(.fbrkh-next-shell,.approved-reference-home,.home-r765-exact,.home-r783-interactive,.home-r792-approved-interactive) #pwaInstallBtn{
    width:100%!important;
    max-width:none;
  }
}