/* Account onboarding is a presentation gate; server authentication remains authoritative. */
html:root body[data-app-feature="account-center"] #panelAccountCenter [data-account-private][hidden] { display:none !important; }
html:root body[data-app-feature="account-center"] #panelAccountCenter .account-center-steps,
html:root body[data-app-feature="account-center"] #panelAccountCenter .account-step-index { display:none !important; }
html:root body[data-app-feature="account-center"] #panelAccountCenter .account-center-head { padding-bottom:20px !important; }
html:root body[data-app-feature="account-center"] #panelAccountCenter #accountCenterTitle { font-size:26px !important; line-height:1.4; }
html:root body[data-app-feature="account-center"] #panelAccountCenter .account-center-intro { margin:8px 0 0; color:#59677c; font-size:14px; line-height:1.7; }
#panelAccountCenter .account-login-welcome { display:none; }
html:root body[data-app-feature="account-center"] #panelAccountCenter[data-account-view="guest"] .account-center-shell { height:auto !important; min-height:100% !important; padding:28px !important; }
html:root body[data-app-feature="account-center"] #panelAccountCenter[data-account-view="guest"] :is(.account-center-body,.account-center-main,.account-center-main__primary,.account-center-grid) { display:block !important; height:auto !important; min-height:0 !important; overflow:visible !important; }
html:root body[data-app-feature="account-center"] #panelAccountCenter[data-account-view="guest"] .account-center-grid { max-width:600px !important; margin:24px auto !important; }
html:root body[data-app-feature="account-center"] #panelAccountCenter[data-account-view="guest"] .account-card--key { display:flex !important; flex-direction:column; gap:16px; padding:28px !important; min-width:0; border:1px solid #dce2ec !important; border-radius:12px !important; box-shadow:none !important; }
html:root body[data-app-feature="account-center"] #panelAccountCenter[data-account-view="guest"] .account-login-welcome { display:block; }
#panelAccountCenter .account-login-welcome h4 { margin:0; font-size:20px; color:#172033; }
#panelAccountCenter .account-login-welcome p { margin:8px 0 20px; color:#59677c; font-size:14px; line-height:1.7; }
#panelAccountCenter .account-login-methods { display:grid; grid-template-columns:1fr 1fr; gap:4px; padding:4px; background:#f2f4f7; border-radius:8px; }
#panelAccountCenter .account-login-methods button { min-height:42px; border:1px solid transparent; border-radius:6px; background:transparent; color:#59677c; font:inherit; font-size:14px; cursor:pointer; }
#panelAccountCenter .account-login-methods button[aria-pressed="true"] { background:#fff; border-color:#dce2ec; color:#172033; font-weight:600; }
#panelAccountCenter .account-login-methods button:focus-visible { outline:2px solid currentColor; outline-offset:2px; }
html:root body[data-app-feature="account-center"] #panelAccountCenter[data-account-view="guest"] :is(.account-key-secondary-actions,.account-key-recharge-row,.account-subkey-block,.account-phone-summary,[data-account-email-tab="bind"],.account-card--key > .account-card__head) { display:none !important; }
html:root body[data-app-feature="account-center"] #panelAccountCenter[data-account-view="guest"][data-account-login="email"] :is(.account-key-row,.account-key-actions) { display:none !important; }
html:root body[data-app-feature="account-center"] #panelAccountCenter[data-account-view="guest"][data-account-login="key"] .account-phone-details { display:none !important; }
html:root body[data-app-feature="account-center"] #panelAccountCenter[data-account-view="guest"] .account-phone-details { margin:0 !important; padding:0 !important; border:0 !important; background:transparent !important; }
html:root body[data-app-feature="account-center"] #panelAccountCenter[data-account-view="guest"] .account-phone-body { padding:0 !important; }
html:root body[data-app-feature="account-center"] #panelAccountCenter[data-account-view="guest"] .account-phone-compact { display:flex !important; flex-wrap:wrap; gap:12px; }
html:root body[data-app-feature="account-center"] #panelAccountCenter[data-account-view="guest"] .account-phone-compact input { box-sizing:border-box; flex:1 1 100%; width:100% !important; min-width:0 !important; min-height:44px; }
html:root body[data-app-feature="account-center"] #panelAccountCenter[data-account-view="guest"] .account-phone-compact button { min-height:44px; }
html:root body[data-app-feature="account-center"] #panelAccountCenter[data-account-view="guest"] .account-phone-compact button.account-primary-btn { width:100%; }
html:root body[data-app-feature="account-center"] #panelAccountCenter[data-account-view="guest"] .account-phone-pane[hidden] { display:none !important; }
html:root body[data-app-feature="account-center"] #panelAccountCenter[data-account-view="guest"] #accountCenterHint { order:10; margin:0; }
html:root body[data-app-feature="account-center"] #panelAccountCenter[data-account-view="connected"] .account-card--overview { order:-1; }
@media(max-width:600px) {
 html:root body[data-app-feature="account-center"] #panelAccountCenter[data-account-view="guest"] .account-center-shell { padding:20px 16px 96px !important; }
 html:root body[data-app-feature="account-center"] #panelAccountCenter[data-account-view="guest"] .account-card--key { padding:20px 16px !important; }
}
/* The account page already provides both onboarding methods. */
body[data-app-feature="account-center"] :is(#emailOnboardSoftTip,#authOnboardBanner) { display:none !important; }
html:root body[data-app-feature="account-center"] #panelAccountCenter[data-account-view="guest"] .account-card--key { height:auto !important; min-height:0 !important; align-self:start !important; }
html:root body[data-app-feature="account-center"] #panelAccountCenter[data-account-view="guest"] .account-phone-pane { flex:none !important; min-height:0 !important; height:auto !important; }
html:root body[data-app-feature="account-center"] #panelAccountCenter[data-account-view="connected"] .account-key-recharge-row { display:none !important; }

/* Keep account access beside the balance it belongs to. */
html:root body .page-container.app-container > .sidebar.sidebar--stack > .sidebar-account-entry { display:grid; gap:6px; flex-shrink:0; margin: auto 12px 10px; padding-top:16px; }
html:root body .sidebar .sidebar-account-entry button { display:flex !important; align-items:center; justify-content:center; gap:8px; width:100%; min-height:40px; padding:9px 12px; border:1px solid #dfe3eb; border-radius:10px; background:#fff; color:#3e4859; font:inherit; font-size:13px; font-weight:600; cursor:pointer; box-shadow:none; transition:background-color 150ms ease,border-color 150ms ease; }
html:root body .sidebar .sidebar-account-entry #openAccountCenter[hidden] { display:none !important; }
html:root body .sidebar .sidebar-account-entry .sidebar-account-entry__login:hover { background:#f3f4f7; border-color:#cbd2dd; }
html:root body .sidebar .sidebar-account-entry .sidebar-account-entry__recharge { background:var(--yj-appearance-primary,var(--yj-accent,#263244)); border-color:transparent; color:#fff; }
html:root body .sidebar .sidebar-account-entry .sidebar-account-entry__recharge:hover { filter:brightness(.94); }
html:root body .sidebar .sidebar-account-entry svg { width:16px; height:16px; flex:none; }
html:root body .sidebar .sidebar-account-entry__arrow { margin-left:auto; font-size:16px; font-weight:400; opacity:.8; }
html:root body .sidebar .sidebar-account-entry button:focus-visible { outline:2px solid var(--yj-appearance-primary,#263244); outline-offset:3px; }
html:root body .page-container.app-container > .sidebar.sidebar--stack #sidebarWallet { margin-top:0 !important; }
html:root body #sidebarWallet button.sidebar-wallet__balance { width:100%; min-height:0; padding:0 !important; border:0 !important; border-radius:4px; background:transparent !important; box-shadow:none !important; color:inherit; font:inherit; text-align:left; cursor:pointer; }
html:root body #sidebarWallet button.sidebar-wallet__balance:hover { opacity:.8; }
html:root body #sidebarWallet button.sidebar-wallet__balance:focus-visible { outline:2px solid var(--yj-appearance-primary,#263244); outline-offset:4px; }
html:root body .sidebar.is-collapsed .sidebar-account-entry { margin-inline:4px; }
html:root body .sidebar.is-collapsed .sidebar-account-entry button { font-size:11px; padding-inline:3px; gap:2px; white-space:normal; }
html:root body .sidebar.is-collapsed .sidebar-account-entry svg, html:root body .sidebar.is-collapsed .sidebar-account-entry__arrow { display:none; }
@media (max-width:1100px) {
 html:root body.has-mobile-tab-bar .sidebar.sidebar--stack .sidebar-account-entry :is(#sidebarRechargeBtn,#openAccountCenter) { justify-content:center !important; min-height:40px !important; padding:9px 12px !important; border:1px solid #dfe3eb !important; border-radius:10px !important; background:#fff !important; color:#3e4859 !important; font-size:13px !important; font-weight:600 !important; }
 html:root body.has-mobile-tab-bar .sidebar.sidebar--stack .sidebar-account-entry #sidebarRechargeBtn { background:var(--yj-appearance-primary,var(--yj-accent,#263244)) !important; border-color:transparent !important; color:#fff !important; }
 html:root body.has-mobile-tab-bar .page-container.app-container > .sidebar.sidebar--stack > .sidebar-account-entry { padding-top:8px; }
}
@media (prefers-reduced-motion:reduce) { html:root body .sidebar .sidebar-account-entry button { transition:none; } }

/* Paired account sticker; the label also becomes account-center after login. */
html:root body[data-app-feature] .sidebar.sidebar--stack .sidebar-account-entry #openAccountCenter {
  position:relative; min-height:42px; margin:0 0 6px; padding:9px 12px;
  border:2px solid #19151e !important; border-radius:10px 4px 9px 4px !important;
  background:#fffdf7 !important; color:#19151e !important;
  box-shadow:3px 3px 0 #d8c3ff,4px 4px 0 #19151e !important;
  font-size:14px; font-weight:850 !important; letter-spacing:.04em;
  transform:rotate(1deg); transition:transform 160ms ease,box-shadow 160ms ease,background-color 160ms ease !important;
}
html:root body[data-app-feature] .sidebar.sidebar--stack .sidebar-account-entry #openAccountCenter > span {
  position:relative; font-style:italic; white-space:nowrap;
}
html:root body[data-app-feature] .sidebar.sidebar--stack .sidebar-account-entry #openAccountCenter > span::after {
  content:""; position:absolute; left:-3px; right:-3px; bottom:-3px;
  height:3px; background:#9961ff; transform:rotate(-3deg) scaleX(.55); transform-origin:left;
  transition:transform 180ms ease;
}
html:root body[data-app-feature] .sidebar.sidebar--stack .sidebar-account-entry #openAccountCenter:hover {
  background:#eee4ff !important; transform:rotate(-1deg) translate(-1px,-1px);
  box-shadow:4px 4px 0 #b18aff,5px 5px 0 #19151e !important;
}
html:root body[data-app-feature] .sidebar.sidebar--stack .sidebar-account-entry #openAccountCenter:hover > span::after { transform:rotate(-3deg) scaleX(1); }
html:root body[data-app-feature] .sidebar.sidebar--stack .sidebar-account-entry #openAccountCenter:active {
  transform:translate(2px,2px); box-shadow:1px 1px 0 #d8c3ff,2px 2px 0 #19151e !important;
}
html:root body[data-app-feature] .sidebar.sidebar--stack .sidebar-account-entry #openAccountCenter:focus-visible { outline:3px dashed #7033cc; outline-offset:5px; }
html:root body[data-app-feature] .sidebar.sidebar--stack.is-collapsed .sidebar-account-entry #openAccountCenter {
  padding:7px 2px !important; font-size:11px !important; letter-spacing:0; transform:none;
  box-shadow:2px 2px 0 #d8c3ff !important;
}
html:root body[data-app-feature] .sidebar.sidebar--stack.is-collapsed .sidebar-account-entry #openAccountCenter > span { white-space:normal; }
@media (prefers-reduced-motion:reduce) {
  html:root body[data-app-feature] .sidebar.sidebar--stack .sidebar-account-entry #openAccountCenter,
  html:root body[data-app-feature] .sidebar.sidebar--stack .sidebar-account-entry #openAccountCenter > span::after { transition:none !important; }
}
/* Street-poster recharge sticker. Original CSS; references: css-buttons / PowerGlitch. */
html:root body[data-app-feature] .sidebar.sidebar--stack .sidebar-account-entry #sidebarRechargeBtn {
  position:relative; isolation:isolate; overflow:hidden;
  min-height:48px; margin:3px 0 7px; padding:10px 8px; gap:6px;
  border:2px solid #19151e !important; border-radius:5px 12px 5px 10px !important;
  background:#e7ff3c !important; color:#19151e !important;
  box-shadow:4px 4px 0 #9961ff,6px 6px 0 #19151e !important;
  font-size:15px; font-weight:900; letter-spacing:.06em;
  transform:rotate(-2deg);
  transition:transform 160ms ease,box-shadow 160ms ease !important;
}
html:root body[data-app-feature] .sidebar.sidebar--stack .sidebar-account-entry #sidebarRechargeBtn > * { position:relative; z-index:1; }
html:root body[data-app-feature] .sidebar.sidebar--stack .sidebar-account-entry #sidebarRechargeBtn > span:first-of-type {
  font-style:italic; white-space:nowrap; transform:skew(-6deg); text-shadow:1px 1px 0 #fff;
}
html:root body[data-app-feature] .sidebar.sidebar--stack .sidebar-account-entry #sidebarRechargeBtn svg { stroke-width:2.5; transform:rotate(-10deg); }
html:root body[data-app-feature] .sidebar.sidebar--stack .sidebar-account-entry #sidebarRechargeBtn::before {
  content:""; position:absolute; inset:0; z-index:0; pointer-events:none;
  background:radial-gradient(circle,#19151e 1px,transparent 1.3px) right top / 5px 5px no-repeat;
  background-size:31px 100%; opacity:.17;
}
html:root body[data-app-feature] .sidebar.sidebar--stack .sidebar-account-entry #sidebarRechargeBtn::after {
  content:""; position:absolute; z-index:0; pointer-events:none;
  width:25px; height:100px; top:-26px; left:-60px;
  background:#fff; opacity:.55; transform:rotate(28deg);
  animation:yj-recharge-paint 4.8s ease-in-out infinite;
}
html:root body[data-app-feature] .sidebar.sidebar--stack .sidebar-account-entry #sidebarRechargeBtn .sidebar-account-entry__arrow {
  display:grid; place-items:center; flex:none; width:24px; height:24px;
  margin-left:auto; border-radius:50%; background:#19151e; color:#e7ff3c;
  font-size:21px; line-height:1; font-weight:800; opacity:1;
  animation:yj-recharge-arrow 3.4s ease-in-out infinite;
}
html:root body[data-app-feature] .sidebar.sidebar--stack .sidebar-account-entry #sidebarRechargeBtn:hover {
  filter:none; transform:rotate(1deg) translate(-2px,-2px);
  background:#efff6d !important; box-shadow:6px 6px 0 #9961ff,8px 8px 0 #19151e !important;
}
html:root body[data-app-feature] .sidebar.sidebar--stack .sidebar-account-entry #sidebarRechargeBtn:hover > span:first-of-type {
  animation:yj-recharge-print 420ms steps(2,end) 1;
}
html:root body[data-app-feature] .sidebar.sidebar--stack .sidebar-account-entry #sidebarRechargeBtn:active {
  transform:rotate(-1deg) translate(3px,3px); box-shadow:1px 1px 0 #9961ff,2px 2px 0 #19151e !important;
}
html:root body[data-app-feature] .sidebar.sidebar--stack .sidebar-account-entry #sidebarRechargeBtn:focus-visible { outline:3px dashed #7033cc; outline-offset:6px; }
html:root body[data-app-feature] .sidebar.sidebar--stack.is-collapsed .sidebar-account-entry #sidebarRechargeBtn {
  padding:7px 2px; font-size:11px; letter-spacing:0; transform:none; box-shadow:2px 3px 0 #9961ff !important;
}
html:root body[data-app-feature] .sidebar.sidebar--stack.is-collapsed .sidebar-account-entry #sidebarRechargeBtn .sidebar-account-entry__arrow { display:none; }
html:root body[data-app-feature] .sidebar.sidebar--stack.is-collapsed .sidebar-account-entry #sidebarRechargeBtn > span:first-of-type { white-space:normal; }
@keyframes yj-recharge-paint { 0%,68% { left:-60px; } 88%,100% { left:130%; } }
@keyframes yj-recharge-arrow { 0%,72%,100% { transform:translate(0,0) rotate(-8deg); } 80% { transform:translate(2px,-2px) rotate(8deg); } 88% { transform:translate(0,0) rotate(-8deg); } }
@keyframes yj-recharge-print { 0%,100% { text-shadow:1px 1px 0 #fff; } 25% { transform:translate(-1px,1px) skew(-6deg); text-shadow:2px 0 #9961ff,-2px 0 #fff; } 65% { transform:translate(1px,-1px) skew(-6deg); text-shadow:-2px 0 #9961ff,2px 0 #fff; } }
@media (prefers-reduced-motion:reduce) {
  html:root body[data-app-feature] .sidebar.sidebar--stack .sidebar-account-entry #sidebarRechargeBtn { transition:none !important; }
  html:root body[data-app-feature] .sidebar.sidebar--stack .sidebar-account-entry #sidebarRechargeBtn *,
  html:root body[data-app-feature] .sidebar.sidebar--stack .sidebar-account-entry #sidebarRechargeBtn::after { animation:none !important; }
}
html:root body #authOnboardBanner .auth-onboard-banner__inner { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 12px; padding: 16px 20px; }
html:root body #authOnboardBanner .auth-onboard-banner__title { display: block !important; margin: 0; color: #263244; font-size: 15px; font-weight: 600; }
html:root body #authOnboardBanner .auth-onboard-banner__intro { margin: 5px 0 0; color: #59677c; font-size: 13px; }
html:root body #authOnboardBanner .auth-onboard-banner__actions { display: flex; gap: 8px; flex-shrink: 0; }
/* The home welcome already gives a direct login path; avoid a second floating signup prompt. */
html:root body.auth-onboard-visible[data-app-feature="operation-center"] #emailOnboardSoftTip { display: none !important; }
html:root body #yjMobileTopChrome #yjMobileTopRechargeBtn { background: var(--accent, #263244); border: 1px solid transparent; color: #fff; border-radius: 8px; padding-inline: 12px; }
@media (max-width: 767px) {
 html:root body.has-mobile-tab-bar #authOnboardBanner .auth-onboard-banner__title { display: block !important; }
 html:root body #authOnboardBanner .auth-onboard-banner__inner { padding: 12px !important; }
 html:root body #authOnboardBanner .auth-onboard-banner__actions { width: 100%; }
 html:root body #authOnboardBanner .auth-onboard-banner__actions button { flex: 1; }
 html:root body #yjMobileTopChrome .yj-mobile-top-chrome__title { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
 html:root body #yjMobileTopChrome .yj-mobile-top-chrome__actions { flex-shrink: 0; gap: 6px; }
}
