/* emulog 앱 상단 바 — emu-appbar.js 와 한 쌍. nginx(emulog-bar.conf)가 앱 HTML <body> 뒤에 이 파일과 정적 바를 넣는다.
 * 팔레트·워드마크는 apps.css 와 같다(Neo둥근모 16px 의 배수, 밤색 바탕, 시안 포커스). 홈 화면(iframe) 안에서는 숨긴다. */
:root{--emu-bar-h:40px}   /* 서비스 색 띠 4px + 내용 36px */
html[data-emu-framed]{--emu-bar-h:0px}
.emu-appbar{position:sticky;top:0;z-index:60;box-sizing:border-box;height:var(--emu-bar-h);display:flex;align-items:center;justify-content:space-between;gap:8px;
  padding:0 18px;background:rgba(10,13,28,.94);border-top:4px solid var(--emu-svc,#5b8cff);font:600 13px/1 -apple-system,BlinkMacSystemFont,"Apple SD Gothic Neo","Noto Sans KR",sans-serif;color:#c8d1f5}
html[data-emu-framed] .emu-appbar{display:none}
.emu-appbar a,.emu-appbar button{font:inherit;color:inherit;text-decoration:none}
.emu-ab-home{display:inline-flex;align-items:center;gap:8px;height:28px;padding:0 8px 0 4px;color:#eef1ff;white-space:nowrap}
.emu-ab-arrow{color:#62edff;font-size:12px}
.emu-ab-px{font-family:var(--emu-px,"NeoDunggeunmo","Neo둥근모",ui-monospace,monospace);font-weight:400;font-size:16px;line-height:1;letter-spacing:0;-webkit-font-smoothing:none}
.emu-ab-t{font-size:12px;color:#9aa6c8}
.emu-ab-home:hover .emu-ab-t,.emu-ab-home:focus-visible .emu-ab-t{color:#62edff}
.emu-ab-r{display:flex;align-items:center;gap:8px;min-width:0}
.emu-ab-slot{display:flex;align-items:center;min-width:0}
.emu-appbar .emu-ab-login,.emu-appbar .emu-ab-chip{box-sizing:border-box;display:inline-flex;align-items:center;gap:6px;height:28px;padding:0 12px;cursor:pointer;border:0;border-radius:0;
  background:#5b8cff;color:#0a0d1c;font-weight:700;box-shadow:2px 2px 0 #000}
.emu-appbar .emu-ab-login:hover,.emu-appbar .emu-ab-chip:hover,.emu-appbar .emu-ab-login:focus-visible,.emu-appbar .emu-ab-chip:focus-visible{background:#eef1ff;color:#0a0d1c}
.emu-appbar .emu-ab-chip[aria-expanded=true]{background:#eef1ff;color:#0a0d1c}
.emu-ab-login:active,.emu-ab-chip:active{transform:translate(1px,1px);box-shadow:1px 1px 0 #000}
.emu-ab-user{position:relative;min-width:0}
.emu-appbar .emu-ab-chip{max-width:min(46vw,220px)}
.emu-ab-name{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.emu-ab-caret{font-size:10px}
.emu-ab-menu{position:absolute;right:0;top:32px;min-width:128px;background:#10152b;border:1px solid #2f3a66;box-shadow:3px 3px 0 #000;display:flex;flex-direction:column}
.emu-ab-menu[hidden],.emu-ab-item[hidden]{display:none}
.emu-ab-menu{min-width:128px;white-space:nowrap}
/* 후원 버튼: 로그인 옆. 주소·target·rel 은 앱 머리띠의 '☕ 커피 후원' 링크와 같다(/donate.html, _blank, noopener) */
.emu-appbar .emu-ab-donate{box-sizing:border-box;display:inline-flex;align-items:center;gap:4px;flex:none;height:28px;padding:0 12px;white-space:nowrap;font-weight:700;
  color:#ffd98a;background:transparent;border:1px solid #5a4a2a;box-shadow:2px 2px 0 #000}
.emu-appbar .emu-ab-donate:hover,.emu-appbar .emu-ab-donate:focus-visible{border-color:#ffd98a;color:#fff0c8}
.emu-ab-donate:active{transform:translate(1px,1px);box-shadow:1px 1px 0 #000}
.emu-ab-item{box-sizing:border-box;display:block;width:100%;padding:9px 12px;text-align:left;background:none;border:0;border-radius:0;cursor:pointer;color:#eef1ff}
.emu-ab-item:hover{background:#1c2447}
.emu-ab-item:disabled{opacity:.5;cursor:default}
.emu-appbar:has(.emu-ab-chip[aria-expanded=true]){z-index:1000}   /* 계정 메뉴가 열린 동안만 앱 머리띠 위로 */
.emu-appbar :focus-visible{outline:2px solid #62edff!important;outline-offset:2px}
/* 앱 머리띠와 한 덩어리로 합친다: 서비스 색 4px 띠는 바 맨 위로 올리고(앱 머리띠의 위쪽 띠는 뗀다), 두 줄은 같은 밤색 바탕·같은 좌우 여백으로 이어 붙인다.
 * 같은 일을 하는 앱 자체의 '🏠 emulog' 링크는 숨긴다(홈 화면 iframe 안에서는 셸의 '홈'과 겹치므로 거기서도 숨긴다). */
.topbar-right a[href="https://emulog.app/"],
body>nav a[href="https://emulog.app/"]{display:none!important}
html:not([data-emu-framed]) .topbar,html:not([data-emu-framed]) body>nav{top:var(--emu-bar-h);border-top:0!important;padding-left:18px;padding-right:18px}
html:not([data-emu-framed]){scroll-padding-top:var(--emu-bar-h)}
/* 이 바(emu-appbar.js 가 html[data-emu-ab] 를 달았을 때만)가 앱 머리띠의 자체 로그인·후원 버튼을 대신한다.
 * - 후원: 머리띠 안의 '☕ 커피 후원'을 숨긴다(바닥글 링크는 그대로). 홈 화면(iframe) 안에서도 셸의 후원 버튼과 겹치므로 숨긴다.
 * - 로그인: 앱 계정으로 로그아웃한 상태의 #authbar(로그인·회원가입)를 숨기고, 바의 로그인 메뉴가 '이 서비스 기존 계정 로그인'으로 숨긴 버튼을 대신 누른다.
 *   앱 계정으로 로그인한 상태(.auth-user 있음)는 세팅 등록·내 세팅·로그아웃 같은 앱 기능이 들어 있으므로 숨기지 않는다. */
html[data-emu-ab] .authbar:not(:has(.auth-user)){display:none!important}
html[data-emu-ab] .topbar a.btn-coffee[href="https://emulog.app/donate.html"]{display:none!important}
/* 앱 자체 로그인(#authbar)은 그대로 두되 '이 서비스 전용 계정' 라벨로 중앙 'emulog 로그인'과 구분한다(통합 S3 전까지 공존). 홈 화면 안에서도 같다. */
.authbar{align-items:center}
.authbar::before{content:"이 서비스 전용 계정";flex:none;margin-right:6px;font:600 12px/1 -apple-system,BlinkMacSystemFont,"Apple SD Gothic Neo","Noto Sans KR",sans-serif;color:#c8d1f5;white-space:nowrap}
@media (max-width:480px){.emu-appbar .emu-ab-chip{max-width:38vw}.emu-ab-r{gap:6px}.emu-appbar .emu-ab-donate{padding:0 9px}.emu-appbar{padding:0 14px}.emu-ab-t{display:none}.emu-ab-home{padding-right:4px}
  html:not([data-emu-framed]) .topbar,html:not([data-emu-framed]) body>nav{padding-left:14px;padding-right:14px}
  /* 좁은 화면: 바는 위로 스크롤돼 사라지고 앱 머리띠만 붙어 남는다(화면 위 약 130px 를 계속 차지하지 않게). 버튼 줄이 옆으로 더 있음을 오른쪽 끝 흐림으로 알린다 */
  .emu-appbar{position:relative}
  html:not([data-emu-framed]) .topbar,html:not([data-emu-framed]) body>nav{top:0}
  .topbar-right.emu-more{-webkit-mask-image:linear-gradient(90deg,#000 calc(100% - 28px),transparent);mask-image:linear-gradient(90deg,#000 calc(100% - 28px),transparent)}}
@media (prefers-reduced-motion:reduce){.emu-ab-login:active,.emu-ab-chip:active{transform:none}}
@media print{.emu-appbar{display:none}}
