/* CLAUDE C-UX · FIRST-02 — /configure 표시 계층 보강 (CR-02 승인).
   DOM·데이터·UUID·해시 로직은 건드리지 않고 growth-config.css 뒤에서 표시만 다듬는다. */

/* 비텍스트 경계 대비 3:1 이상 (#7B8597 on #fff ≈ 3.9:1) */
.config-app button,.config-app input,.config-app textarea,.config-app select{border-color:#7b8597}
.config-card,.config-blocks>li,.config-app fieldset{border-color:#7b8597}

/* 헤더·푸터 링크 터치 타깃 */
.config-header a{display:inline-flex;align-items:center;min-height:44px}
.config-page .foot .foot-nav a{min-height:44px}

/* 단계 표시: 숫자만 있던 "n / 5"를 읽기 쉬운 배지로 */
#config-progress{display:inline-flex;align-items:center;margin:8px 0 0;padding:4px 12px;border:1px solid #7b8597;border-radius:999px;background:#fff;font:700 13px/20px var(--mono,ui-monospace,monospace);color:#0e1828}
#config-progress::before{content:"단계 ";font-family:inherit;font-weight:400;margin-right:4px}

/* 선택 상태를 색뿐 아니라 표식으로 표시 */
.config-app button[aria-pressed=true]{border-color:#c95614;border-width:2px;background:#fff0e6;font-weight:700}
.config-app button[aria-pressed=true]::before{content:"✓ ";font-weight:700}
.config-card:has(button[aria-pressed=true]){border-color:#c95614;box-shadow:0 0 0 2px #ffd9c2}
.config-app button[data-mode]{min-height:44px}

/* 비활성 버튼은 흐리되 이유가 읽히도록 */
.config-app button:disabled{opacity:.55;text-decoration:line-through;text-decoration-thickness:1px}

/* 오류·상태 안내 */
.config-status{padding:12px 16px;border-left:4px solid #7b8597;background:#fff;border-radius:0 8px 8px 0}
.config-status:empty{display:none}

/* 모바일: 이전/다음 줄을 화면 아래에 고정해 긴 화면에서도 바로 닿게 한다 */
@media (max-width:700px){
  .config-nav{position:sticky;bottom:0;z-index:5;margin:0 -18px;padding:12px 18px calc(12px + env(safe-area-inset-bottom));background:rgba(245,244,239,.97);border-top:1px solid #7b8597;gap:12px}
  .config-nav button{flex:1 1 0;min-height:48px;margin:0}
  .config-grid{gap:12px}
  .config-card a{min-height:44px;display:flex;align-items:center}
}
@media (prefers-reduced-motion:reduce){.config-app *{transition:none!important;scroll-behavior:auto!important}}
@media (forced-colors:active){
  .config-app button[aria-pressed=true]{border-color:Highlight}
  .config-card:has(button[aria-pressed=true]){outline:2px solid Highlight}
}
