/* Mode Atlas Profile and Settings menus.
   Menu visual ownership belongs here; JS files only inject markup and bind behaviour. */
.ma-drawer-backdrop{position:fixed;inset:0;z-index:80;display:none;background:rgba(2,6,23,.56);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);}
.ma-drawer-backdrop.open{display:block;}
.ma-shared-profile-drawer,.ma-shared-settings-drawer{position:fixed;top:18px;right:18px;z-index:90;width:min(420px,calc(100vw - 36px));max-height:calc(100vh - 36px);overflow-y:auto;padding:18px;border-radius:28px;background:radial-gradient(circle at top right,rgba(125,181,255,.18),transparent 34%),linear-gradient(180deg,rgba(22,25,34,.98),rgba(9,11,16,.98));border:1px solid rgba(255,255,255,.10);box-shadow:0 32px 90px rgba(0,0,0,.55);color:var(--text,#f3f3f3);box-sizing:border-box;transform:translateX(calc(100% + 44px));transition:transform .24s ease;}
.ma-shared-profile-drawer.open,.ma-shared-settings-drawer.open{transform:translateX(0);}
.ma-drawer-head{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;margin-bottom:14px;}
.ma-menu-kicker{font-size:11px;font-weight:900;letter-spacing:.14em;text-transform:uppercase;color:var(--muted,#9aa3b8);}
.ma-drawer-title{font-weight:950;font-size:1.8rem;line-height:1.05;letter-spacing:-.04em;color:#f8fbff;}
.ma-drawer-close{appearance:none;display:inline-flex;align-items:center;justify-content:center;box-sizing:border-box;width:auto;min-width:74px;height:42px;min-height:42px;padding:0 16px;border:1px solid rgba(148,163,184,.24);background:rgba(15,23,42,.62);color:#eaf2ff;border-radius:999px;font:inherit;font-size:14px;font-weight:850;line-height:1;white-space:nowrap;cursor:pointer;}
.ma-drawer-close:hover{background:rgba(30,41,59,.82);border-color:rgba(125,181,255,.36);}
.ma-profile-card,.ma-settings-card,.ma-account-card,.ma-sync-card,.ma-branch-card,.ma-achievement-card-summary,.ma-settings-panel,.ma-save-section{margin-top:12px;padding:14px;border-radius:18px;background:rgba(255,255,255,.045);border:1px solid rgba(255,255,255,.085);box-shadow:inset 0 1px 0 rgba(255,255,255,.035);}
.ma-auth-actions{margin-top:12px;display:grid;grid-template-columns:1fr;gap:10px;}
.ma-shared-profile-drawer .ma-menu-action,.ma-shared-settings-drawer .ma-menu-action,.ma-shared-settings-drawer .ma-settings-choice{min-height:46px;border-radius:14px;display:inline-flex;align-items:center;justify-content:center;text-align:center;font-size:14px;font-weight:850;line-height:1.15;letter-spacing:0;text-transform:none;text-decoration:none;padding:10px 12px;box-sizing:border-box;background:rgba(15,23,42,.66);border:1px solid rgba(148,163,184,.18);color:#eef4ff;box-shadow:inset 0 1px 0 rgba(255,255,255,.06),0 10px 24px rgba(0,0,0,.16);cursor:pointer;}
.ma-shared-profile-drawer .ma-menu-action:hover,.ma-shared-settings-drawer .ma-menu-action:hover,.ma-shared-settings-drawer .ma-settings-choice:hover{background:rgba(30,41,59,.82);border-color:rgba(125,181,255,.34);transform:translateY(-1px);}
.ma-shared-profile-drawer .ma-menu-action.ma-primary,.ma-shared-settings-drawer .ma-menu-action.ma-primary,.ma-shared-settings-drawer .ma-settings-choice.ma-primary{background:rgba(45,72,118,.76);border-color:rgba(125,181,255,.42);}
.ma-shared-settings-drawer .ma-danger{border-color:rgba(255,107,107,.38);color:#ffd6d6;background:rgba(127,29,29,.28);}
.ma-account-user{display:flex;align-items:center;gap:12px;}
.ma-account-avatar{width:46px;height:46px;border-radius:999px;object-fit:cover;background:rgba(125,181,255,.16);border:1px solid rgba(125,181,255,.24);}
.ma-account-name{font-weight:950;color:#f8fbff;}
.ma-account-email,.ma-sync-detail{color:var(--muted,#9aa3b8);font-size:13px;line-height:1.45;}
.section-kicker,.ma-settings-title{font-size:12px;font-weight:950;letter-spacing:.16em;text-transform:uppercase;color:#aeb9d0;margin-bottom:10px;}
.ma-sync-status-line{display:flex;align-items:center;gap:10px;margin-top:6px;}
.ma-sync-dot{width:10px;height:10px;border-radius:999px;background:#7db5ff;box-shadow:0 0 0 4px rgba(125,181,255,.12);flex:0 0 auto;}
.ma-sync-dot.ok,.ma-sync-dot.cloud{background:#75e3a8;box-shadow:0 0 0 4px rgba(117,227,168,.13);}
.ma-sync-dot.warning,.ma-sync-dot.offline{background:#ffca75;box-shadow:0 0 0 4px rgba(255,202,117,.15);}
.ma-sync-meta{margin-top:8px;font-size:12px;color:var(--muted,#9aa3b8);}
.ma-branch-grid{display:grid;grid-template-columns:1fr 1fr;gap:9px;margin-top:10px;}
.ma-branch-button{justify-content:center;text-align:center;text-decoration:none;}
.ma-branch-button.ma-placeholder{opacity:.56;cursor:not-allowed;}
.ma-achievement-summary{display:flex;align-items:baseline;gap:8px;margin:8px 0 12px;}
.ma-achievement-summary strong{font-size:30px;line-height:1;}
.ma-achievement-summary span{color:var(--muted,#9aa3b8);font-size:13px;font-weight:800;}
.ma-shared-settings-drawer .ma-settings-grid{display:grid;gap:10px;margin-top:10px;}
.ma-shared-settings-drawer .ma-settings-grid.two{grid-template-columns:repeat(2,minmax(0,1fr));}
.ma-shared-settings-drawer .ma-settings-grid.three{grid-template-columns:repeat(3,minmax(0,1fr));}
.ma-shared-settings-drawer .ma-settings-grid.four{grid-template-columns:repeat(2,minmax(0,1fr));}
.ma-shared-settings-drawer .ma-display-option.active,.ma-shared-settings-drawer [data-ma-theme-choice].active,.ma-shared-settings-drawer [data-ma-theme-choice][data-active="true"],.ma-shared-settings-drawer .ma-sound-toggle.active,.ma-shared-settings-drawer .ma-sound-toggle[data-active="true"]{border-color:rgba(125,181,255,.68);background:linear-gradient(180deg,rgba(63,94,143,.72),rgba(30,48,80,.86));color:#f8fbff;box-shadow:0 0 0 3px rgba(125,181,255,.18),inset 0 1px 0 rgba(255,255,255,.12);}
.ma-settings-trigger{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  box-sizing:border-box;
  width:52px;
  min-width:52px;
  height:52px;
  min-height:52px;
  padding:0;
  border-radius:999px;
  gap:0;
}
.ma-settings-trigger .ma-settings-icon{font-size:2rem;line-height:1;display:block;}
.ma-settings-trigger .ma-settings-label{display:none;}

/* Shared nav account/action ordering.
   Branch-nav pages use page-specific HTML, then this shared binding injects Settings.
   Keep the action pair consistent as: Profile, then Settings. */
.branch-links > .profile-trigger,
.nav > .profile-trigger,
.topbar > .profile-trigger {
  order: 90;
}

.branch-links > .ma-settings-trigger,
.nav > .ma-settings-trigger,
.topbar > .ma-settings-trigger {
  order: 91;
}

@media(max-width:1180px){body[data-effective-display-mode="tablet"] .ma-shared-profile-drawer,body[data-effective-display-mode="tablet"] .ma-shared-settings-drawer{width:min(560px,calc(100vw - 32px));max-height:calc(100dvh - 32px);}}
@media(max-width:560px){.ma-shared-profile-drawer,.ma-shared-settings-drawer{top:12px;right:12px;left:12px;width:auto;max-height:calc(100dvh - 24px);border-radius:22px;}.ma-branch-grid,.ma-shared-settings-drawer .ma-settings-grid.two,.ma-shared-settings-drawer .ma-settings-grid.three,.ma-shared-settings-drawer .ma-settings-grid.four{grid-template-columns:1fr;}}
body[data-effective-display-mode="phone"] .ma-shared-profile-drawer,body[data-effective-display-mode="phone"] .ma-shared-settings-drawer{top:10px;right:10px;left:10px;width:auto;max-height:calc(100dvh - 20px);border-radius:22px;padding:14px;}body[data-effective-display-mode="phone"] .ma-shared-profile-drawer .ma-menu-action,body[data-effective-display-mode="phone"] .ma-shared-settings-drawer .ma-menu-action,body[data-effective-display-mode="phone"] .ma-shared-settings-drawer .ma-settings-choice{font-size:13px;}
body[data-effective-display-mode="phone"] .ma-branch-grid,body[data-effective-display-mode="phone"] .ma-shared-settings-drawer .ma-settings-grid.two,body[data-effective-display-mode="phone"] .ma-shared-settings-drawer .ma-settings-grid.three,body[data-effective-display-mode="phone"] .ma-shared-settings-drawer .ma-settings-grid.four{grid-template-columns:1fr;}


/* Shared profile/settings mobile ownership.
   Settings is a separate nav action; it must not inherit profile/avatar positioning. */
@media (max-width: 760px), (max-width: 900px) and (orientation: portrait), (pointer: coarse) {
  .topbar,
  .branch-nav,
  .study-nav {
    position: relative;
  }

  .topbar .ma-settings-trigger,
  .branch-nav .ma-settings-trigger,
  .study-nav .ma-settings-trigger {
    position: absolute;
    top: max(12px, env(safe-area-inset-top, 0px));
    right: 72px;
    z-index: 9;
    width: 48px;
    height: 48px;
    min-width: 48px;
    max-width: 48px;
    min-height: 48px;
    padding: 0;
    border-radius: 999px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
  }

  .topbar .ma-settings-trigger .ma-settings-icon,
  .branch-nav .ma-settings-trigger .ma-settings-icon,
  .study-nav .ma-settings-trigger .ma-settings-icon {
    font-size: 1.55rem;
  }

  .topbar .ma-settings-trigger .ma-settings-label,
  .branch-nav .ma-settings-trigger .ma-settings-label,
  .study-nav .ma-settings-trigger .ma-settings-label {
    display: none;
  }

  .ma-shared-profile-drawer,
  .ma-shared-settings-drawer {
    top: calc(env(safe-area-inset-top, 0px) + 14px);
    right: 12px;
    bottom: calc(env(safe-area-inset-bottom, 0px) + 14px);
    left: 12px;
    width: auto;
    max-height: none;
    border-radius: 22px;
    padding: 14px;
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
  }

  .ma-drawer-head {
    position: sticky;
    top: -14px;
    z-index: 3;
    align-items: center;
    padding: 14px 0 12px;
    margin: -14px 0 12px;
    background:
      radial-gradient(circle at top right, rgba(125,181,255,.16), transparent 34%),
      linear-gradient(180deg, rgba(18,22,31,.98), rgba(12,15,22,.96));
    border-bottom: 1px solid rgba(148,163,184,.14);
  }

  .ma-drawer-title {
    font-size: clamp(1.45rem, 7vw, 1.85rem);
  }

  .ma-drawer-close {
    min-width: 72px;
    height: 46px;
    min-height: 46px;
    padding: 0 16px;
    flex: 0 0 auto;
    touch-action: manipulation;
  }

  .ma-shared-settings-drawer .ma-settings-grid.two,
  .ma-shared-settings-drawer .ma-settings-grid.three,
  .ma-shared-settings-drawer .ma-settings-grid.four,
  .ma-branch-grid {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 430px) {
  .topbar .ma-settings-trigger,
  .branch-nav .ma-settings-trigger,
  .study-nav .ma-settings-trigger {
    top: 10px;
    right: 58px;
    width: 42px;
    height: 42px;
    min-width: 42px;
    max-width: 42px;
    min-height: 42px;
  }

  .topbar .ma-settings-trigger .ma-settings-icon,
  .branch-nav .ma-settings-trigger .ma-settings-icon,
  .study-nav .ma-settings-trigger .ma-settings-icon {
    font-size: 1.35rem;
  }
}


/* Responsive account/profile ownership moved from mode-atlas-responsive.css. */
html[data-ma-signed-in="true"] #profileSignInBtn,
html[data-ma-signed-in="true"] #studyProfileSignIn,
html[data-ma-signed-in="true"] #identitySignInBtn,
html[data-ma-signed-in="true"] [data-profile-sign-in],
html[data-ma-signed-in="true"] [data-ma-sign-in] {
  display: none;
  visibility: hidden;
  pointer-events: none;
}

html[data-ma-signed-in="false"] #profileSignOutBtn,
html[data-ma-signed-in="false"] #studyProfileSignOut,
html[data-ma-signed-in="false"] #identitySignOutBtn,
html[data-ma-signed-in="false"] [data-profile-sign-out],
html[data-ma-signed-in="false"] [data-ma-sign-out] {
  display: none;
  visibility: hidden;
  pointer-events: none;
}

html[data-ma-signed-in="true"] #profileSignOutBtn,
html[data-ma-signed-in="true"] #studyProfileSignOut,
html[data-ma-signed-in="true"] #identitySignOutBtn,
html[data-ma-signed-in="true"] [data-profile-sign-out],
html[data-ma-signed-in="true"] [data-ma-sign-out],
html[data-ma-signed-in="false"] #profileSignInBtn,
html[data-ma-signed-in="false"] #studyProfileSignIn,
html[data-ma-signed-in="false"] #identitySignInBtn,
html[data-ma-signed-in="false"] [data-profile-sign-in],
html[data-ma-signed-in="false"] [data-ma-sign-in] {
  visibility: visible;
  pointer-events: auto;
}

@media (max-width: 760px), (max-width: 900px) and (orientation: portrait) {
  .branch-links > .profile-trigger,
  .nav > .profile-trigger,
  .topbar > .profile-trigger,
  .study-nav-btn.profile-trigger,
  #profileOpenBtn,
  #studyProfileBtn {
    grid-column: 2;
    grid-row: 1;
    position: absolute;
    top: 14px;
    right: 14px;
    width: 48px;
    height: 48px;
    min-width: 48px;
    max-width: 48px;
    padding: 0;
    margin: 0;
    border-radius: 999px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
    transform: none;
    z-index: 8;
  }

  .profile-trigger > span:not(.profile-dot),
  .study-nav-btn.profile-trigger > span:not(.profile-dot),
  #profileOpenBtn > span:not(.profile-dot),
  #studyProfileBtn > span:not(.profile-dot) {
    display: none;
  }

  .profile-dot,
  #topProfileDot,
  #profileDot,
  #studyTopProfileDot {
    width: 38px;
    height: 38px;
    min-width: 38px;
    border-radius: 999px;
    overflow: hidden;
    font-size: 0;
  }

  .profile-dot img,
  #topProfileDot img,
  #profileDot img,
  #studyTopProfileDot img {
    width: 100%;
    height: 100%;
    display: block;
    object-fit: cover;
  }

  .brand,
  .branch-brand,
  .study-brand {
    max-width: calc(100vw - 186px);
  }
}

@media (max-width: 520px) {
  .branch-links > .profile-trigger,
  .nav > .profile-trigger,
  .topbar > .profile-trigger,
  .study-nav-btn.profile-trigger,
  #profileOpenBtn,
  #studyProfileBtn {
    top: 12px;
    right: 12px;
    width: 52px;
    height: 52px;
    min-width: 52px;
    max-width: 52px;
  }

  .profile-dot,
  #topProfileDot,
  #profileDot,
  #studyTopProfileDot {
    width: 39px;
    height: 39px;
    min-width: 39px;
  }
}

@media (max-width: 760px), (max-width: 900px) and (orientation: portrait) {
  .profile-trigger,
  .branch-links > .profile-trigger,
  .nav > .profile-trigger,
  .study-nav-btn.profile-trigger,
  #profileOpenBtn,
  #studyProfileBtn {
    top: 10px;
    right: 10px;
    width: 46px;
    height: 46px;
    min-width: 46px;
    max-width: 46px;
    padding: 0;
  }

  .profile-dot,
  #topProfileDot,
  #profileDot,
  #studyTopProfileDot {
    width: 36px;
    height: 36px;
    min-width: 36px;
  }
}

@media (max-width: 430px) {
  .profile-trigger,
  .branch-links > .profile-trigger,
  .nav > .profile-trigger,
  .study-nav-btn.profile-trigger,
  #profileOpenBtn,
  #studyProfileBtn {
    width: 42px;
    height: 42px;
    min-width: 42px;
    max-width: 42px;
  }

  .profile-dot,
  #topProfileDot,
  #profileDot,
  #studyTopProfileDot {
    width: 32px;
    height: 32px;
    min-width: 32px;
  }

  .brand,
  .branch-brand,
  .study-brand {
    max-width: calc(100vw - 150px);
  }
}