/* ═══════════════════════════════════════════════════════════════════════════
   KY MOTORS — kyauth.css · 머리 메뉴 「로그인」 · 다운로드 「BETA 테스트 중!」 배지 (v4.7.0 · 2026-10-14)
   site-top.php(흰 머리) · v4-top.php(검은 머리) 둘 다에서 읽는다. 다른 규칙은 건드리지 않는다.
   ═══════════════════════════════════════════════════════════════════════════ */

/* ── 로그인 링크 ── */
.kyauth{
  display:inline-flex; align-items:center; gap:7px; flex:none;
  min-height:42px; padding:0 14px; border-radius:10px; border:1px solid transparent;
  font-size:13.5px; font-weight:600; line-height:1; letter-spacing:-.01em; white-space:nowrap;
  transition:border-color .2s, background .2s, color .2s;
}
.kyauth svg{ flex:none; }
.kyauth__t{ max-width:9em; overflow:hidden; text-overflow:ellipsis; }
/* 흰 머리(site-top) */
.site-header .kyauth{ color:#23262c; border-color:#E6E8EB; background:#fff; }
.site-header .kyauth:hover{ border-color:#0A0C10; color:#0A0C10; }
/* 검은 머리(v4-top) — 홈 첫 화면은 투명 머리라 같은 밝은 글자 */
.v4head .kyauth{ color:#eae9e4; border-color:#ffffff33; background:transparent; min-height:44px; }
.v4head .kyauth:hover{ border-color:#f6f5f1; color:#f6f5f1; }
.kyauth.is-in .kyauth__t{ font-weight:700; }
@media (max-width:960px){
  .kyauth{ padding:0; width:46px; min-height:46px; justify-content:center; border-radius:12px; }
  .kyauth__t{ display:none; }
}

/* ── BETA 배지 ── 빨강 알약 + 깜빡이는 점 + 퍼지는 고리 */
.kybeta{
  display:inline-flex; align-items:center; gap:5px; margin-left:7px; padding:4px 8px 4px 7px;
  border-radius:999px; background:#E11B12; color:#fff;
  font-size:10.5px; font-weight:800; line-height:1; letter-spacing:-.01em; white-space:nowrap; vertical-align:middle;
  position:relative; top:-1px; animation:kybetaRing 1.8s ease-out 2;   /* v4.11.0: 무한 → 2번(약 4초). 5초 넘게 깜빡이면 WCAG 2.2.2 위반 · 계속 다시 그려 폰 배터리를 쓴다 */
}
.kybeta::before{ content:""; width:6px; height:6px; border-radius:50%; background:#fff; flex:none; animation:kybetaBlink 1s steps(2,start) 4; }
.kybeta b{ font-weight:800; letter-spacing:.04em; }
.kybeta i{ font-style:normal; }
@keyframes kybetaRing{ 0%{ box-shadow:0 0 0 0 rgba(225,27,18,.55); } 70%{ box-shadow:0 0 0 7px rgba(225,27,18,0); } 100%{ box-shadow:0 0 0 0 rgba(225,27,18,0); } }
@keyframes kybetaBlink{ 50%{ opacity:.2; } }
/* 머리 메뉴는 넓을 때만 「테스트 중!」까지 */
@media (max-width:1280px){ .site-nav .kybeta i, .v4nav .kybeta i{ display:none; } }
/* 모바일 전체 메뉴(큰 글자) */
.nav-overlay .kybeta, .v4ov .kybeta{ font-size:12px; padding:5px 10px 5px 8px; margin-left:10px; top:-4px; }
/* 모바일 하단 탭 — 글자 위 작은 꼬리표 */
.ky-tab, .v4tab a{ position:relative; }
.ky-tab .kybeta, .v4tab .kybeta{ position:absolute; top:3px; left:50%; margin:0; transform:translateX(-50%); padding:2px 6px 2px 5px; font-size:10px; gap:3px; }   /* 8.5 → 10px (v4.11.0) */
.ky-tab .kybeta::before, .v4tab .kybeta::before{ width:4px; height:4px; }
.ky-tab .kybeta i, .v4tab .kybeta i{ display:none; }
@media (prefers-reduced-motion:reduce){ .kybeta, .kybeta::before{ animation:none; } }