/* 채운 — 상시 내비게이션 (전 페이지 공유) · 명주 라이트 테마 */
/* 본문 바로가기(skip link, WCAG 2.4.1) — 포커스 전엔 화면 밖, Tab 첫 포커스 시 노출 */
.cw-skip{position:absolute;left:8px;top:-48px;z-index:200;background:#fbf9f4;color:#2a2724;padding:10px 16px;border:1px solid #8a6420;border-radius:5px;text-decoration:none;font-size:.85rem;transition:top .2s}
.cw-skip:focus{top:8px;outline:2px solid #8a6420;outline-offset:2px}
.cwnav{display:flex;align-items:center;gap:clamp(13px,2.3vw,22px);flex-wrap:wrap;justify-content:flex-end}
.cwnav a{font-family:"Spline Sans Mono",ui-monospace,monospace;font-size:.73rem;letter-spacing:.05em;
  color:rgba(111,106,97,.92);text-decoration:none;white-space:nowrap;line-height:1.4;
  position:relative;display:inline-block;padding:.8em 0; /* 탭 히트영역 ≥24px(AA 2.5.8) 확보 */
  -webkit-tap-highlight-color:transparent; /* 모바일 기본 회색 탭 박스 제거(촌스러운 플래시) */
  transition:color .4s cubic-bezier(.16,1,.3,1)}
/* 세련된 인터랙션 — 헤어라인 언더라인이 좌→우로 차오름(hover·포커스·탭·현재탭), 클릭=부드러운 톤업. 브랜드 이징 통일 */
.cwnav a::after{content:"";position:absolute;left:0;right:0;bottom:.6em;height:1px;background:currentColor;
  opacity:.5;transform:scaleX(0);transform-origin:left center;
  transition:transform .5s cubic-bezier(.16,1,.3,1),opacity .4s cubic-bezier(.16,1,.3,1)}
.cwnav a:hover{color:#2a2724}
.cwnav a:hover::after,.cwnav a:focus-visible::after,.cwnav a:active::after{transform:scaleX(1)}
.cwnav a:active{color:#2a2724} /* 누름=즉각 톤업(회색 박스 대체) */
.cwnav a:focus-visible{outline:2px solid #8a6420;outline-offset:3px;border-radius:2px}
.cwnav a.cur{color:#2a2724}
.cwnav a.cur::after{transform:scaleX(1);opacity:.6}
@media(prefers-reduced-motion:reduce){.cwnav a::after{transition:none}}
/* 계정 입구 — 콘텐츠 nav와 가느다란 구분선으로 분리 */
.cwnav a.cw-acct{position:relative;margin-left:clamp(5px,1.1vw,11px);padding-left:clamp(11px,1.5vw,17px)}
.cwnav a.cw-acct::before{content:"";position:absolute;left:0;top:50%;transform:translateY(-50%);
  width:1px;height:.95em;background:rgba(42,39,36,.22)}
.cwnav a.cw-acct-out{color:rgba(120,110,95,.92)} /* 비로그인 로그인 입구 — 활성보다 한 톤 낮되 찾기 쉽게 */
@media(max-width:560px){
  header .wrap{flex-wrap:wrap;align-items:center;gap:7px 0}
  .cwnav{width:100%;justify-content:flex-start;gap:15px;margin-top:1px}
  .cwnav a{font-size:.72rem}
  .cwnav a.cw-acct{margin-left:0;padding-left:0}
  .cwnav a.cw-acct::before{display:none}
}