/* Player account and progress live with the other personal header controls. */
html body #app header .header-player{position:relative;display:inline-flex;align-items:center;justify-content:center;flex:0 0 44px;width:44px;height:44px;min-height:44px;margin:0;padding:0;border:1px solid var(--map-border);border-radius:50%;background:var(--map-surface);color:var(--map-ink);box-shadow:var(--map-shadow);cursor:pointer}
html body #app header .header-player svg{display:block;width:27px;height:27px;pointer-events:none}
html body #app header .header-player[aria-expanded="true"]{background:var(--map-active);border-color:var(--map-ink)}
html body #app header .header-player:active{transform:translateY(1px)}
html body #app header .header-player:focus-visible{outline:3px solid #b78a36;outline-offset:2px}
html body #app header .brand{max-width:none;min-width:0;overflow:visible;margin-right:auto;flex:0 1 auto}
html body #app.map-journey[data-journey-target="explorer-home"] #discovery-tray{left:auto!important;right:max(12px,var(--ui-right,0px))!important;top:var(--player-menu-top,72px)!important;bottom:auto!important;transform:none!important;width:min(320px,calc(100% - 24px))!important;max-width:calc(100% - 24px)!important;max-height:calc(100% - var(--player-menu-top,72px) - 76px - var(--ui-bottom,0px))!important;overflow:auto!important;overscroll-behavior:contain}
html body #app[data-journey-target="explorer-home"] .mobile-map-menu,html body #app[data-journey-target="explorer-home"] .mirble-feedback-button{display:none!important}
@media(max-width:700px){html body #app header .brand{gap:8px}html body #app header .location{display:none}}

/* Personal navigation is a small menu; details open in their own view. */
html body #app[data-journey-target="explorer-home"] #discovery-tray:has(.personal-menu){top:var(--player-menu-top,72px)!important;bottom:auto!important;right:12px!important;left:auto!important;transform:none!important;width:min(350px,calc(100% - 24px))!important;padding:14px!important;max-height:calc(100% - var(--player-menu-top,72px) - 18px)!important;overflow:visible!important}
html body #app .personal-menu .personal-head{display:flex;align-items:center;gap:8px}
html body #app .personal-menu h2{flex:1;margin:0!important;font:600 24px/1.2 Georgia,serif!important;color:inherit}
html body #app .personal-menu .personal-head button{width:40px;min-height:44px;margin:0;padding:0;background:transparent;border:0;color:inherit;font-size:25px}
html body #app .personal-menu .personal-summary{display:flex;justify-content:space-between;gap:12px;align-items:center;padding:8px 0 14px;font:400 12px/1.3 system-ui}
html body #app .personal-menu .personal-summary strong{font:650 17px/1.25 system-ui}
html body #app .personal-menu .personal-summary span{max-width:130px;text-align:right}
html body #app .personal-options{display:grid;grid-template-columns:1fr 1fr;gap:8px}
html body #app .personal-menu :is(.personal-options,.personal-tasks) button{display:flex;flex-direction:column;justify-content:center;gap:3px;width:100%;min-width:0;min-height:68px;padding:10px;text-align:left;border:1px solid #c8cdbb;border-radius:12px;background:#e9eee2;color:inherit;margin:0;cursor:pointer}
html body #app .personal-menu button strong{font:600 15px/1.2 system-ui}
html body #app .personal-menu button small{font:400 12px/1.3 system-ui}
html body #app .personal-menu [data-personal-tone=account]{background:#e0ebe5}
html body #app .personal-menu [data-personal-tone=posts]{background:#eee5d6}
html body #app .personal-menu [data-personal-tone=places]{background:#e6ead9}
html body #app .personal-menu [data-personal-tone=discover]{background:#e1ebee}
html body #app .personal-menu [data-personal-tone=visits]{background:#e5e0ed}
html body #app .personal-menu [data-personal-tone=play]{background:#f1e6c9}
html body #app .personal-menu .personal-admin{width:100%;min-height:44px;margin:10px 0 0;padding:8px 12px;border:1px solid #adbda9;border-radius:10px;background:#e0ebe5;color:inherit;font:600 14px/1.3 system-ui}
html body #app .personal-menu .personal-tasks{display:grid;gap:8px}
html body #app .personal-menu :is(.personal-intro,.personal-footnote,.personal-visits p){font:400 14px/1.4 system-ui;margin:10px 0}
html[data-theme=night] body #app .personal-menu button[data-personal-tone],html[data-theme=night] body #app .personal-menu :is(.personal-tasks button,.personal-admin){background:#344a3d;color:#f5eddd;border-color:#63745c}