/* 설정 아키타입 (모바일 재구성) — SC-M32 · SC-M17 · SC-M37 …
 *
 * 데스크톱은 좌측 세로 탭 열 + 우측 패널. 탭이 19개다.
 * 모바일에서 가로 칩으로 흘리면 찾을 수 없다 — 목록 → 상세 두 단계로 간다.
 *
 * 그리고 이 화면의 요점은 설정값이 아니라 미설정이다. 셋이 비면 기능이 차단된다.
 * 캔버스가 "설정 완료 체크리스트가 없다 — 신규 기능 후보"라 적어 둔 자리를 맨 위에 만든다.
 */

.m--settings .head { background: #fff; }
.m--settings .hd-row { display: flex; align-items: center; justify-content: space-between;
                       padding: .55rem .9rem .45rem; }
.m--settings .ttl { font-size: 1.05rem; font-weight: 700; letter-spacing: -.03em; }
.m--settings .mini { min-height: 30px; display: inline-flex; align-items: center; gap: .3rem; padding: 0 .6rem;
                     border: 1px solid var(--grid); font-size: .72rem; color: var(--ink-2);
                     text-decoration: none; }
.m--settings .mini.full { display: flex; justify-content: center; margin-top: .4rem;
                          min-height: 38px; border-color: var(--live); color: var(--live);
                          font-weight: 600; background: #fff; }
.m--settings .stat { display: flex; flex-wrap: wrap; gap: .1rem .85rem; padding: 0 .9rem .55rem;
                     font-size: .72rem; color: var(--ink-3); }
.m--settings .stat a { color: inherit; text-decoration: none; }
.m--settings .stat b { font-size: .9rem; font-weight: 700; color: var(--ink); letter-spacing: -.02em; }
.m--settings .stat .bad, .m--settings .stat .bad b { color: var(--alert); }

.m--settings .plan { background: var(--sheet); }
.m--settings section { padding: 0 0 .5rem; }
.m--settings h2 { display: flex; align-items: baseline; gap: .35rem; margin: 1rem .9rem .35rem;
                  font-size: .7rem; font-weight: 700; letter-spacing: .08em; color: var(--ink-3); }
.m--settings h2 i { font-style: normal; font-weight: 500; letter-spacing: 0; }

/* 막힌 것 — 설정 완료 체크리스트.
   클래스를 .gate 로 둔 이유: .blk 는 screen_timeline.css 에서 position:absolute 다 (.d 충돌과 같은 종류) */
.m--settings .gate { display: grid; grid-template-columns: 3rem minmax(0, 1fr);
                             gap: .05rem .6rem; padding: .55rem .9rem; background: #fdf1ee;
                             border-bottom: 1px solid #f2ded8; text-decoration: none; color: inherit; }
.m--settings .gate .k { grid-row: 1 / span 2; align-self: center; font-size: .7rem;
                           font-weight: 700; color: var(--alert); }
.m--settings .gate .n { font-size: .88rem; font-weight: 700; letter-spacing: -.02em; }
.m--settings .gate .s { font-size: .7rem; color: #6d4038; line-height: 1.45; }

/* 설정 목록 — 한 줄에 이름 · 현재 값 · 잠금 */
.m--settings .row { display: flex; align-items: center; gap: .5rem; min-height: 50px;
                    padding: .5rem .9rem; background: #fff; border-bottom: 1px solid var(--grid-2);
                    text-decoration: none; color: inherit; position: relative; }
.m--settings .row::after { content: "›"; color: var(--ink-3); font-size: 1rem; }
.m--settings .row .n { flex: none; display: flex; align-items: baseline; gap: .3rem;
                       font-size: .86rem; font-weight: 600; letter-spacing: -.02em; }
.m--settings .row .n em { font-style: normal; font-size: .62rem; font-weight: 500; color: var(--ink-3); }
.m--settings .row .v { flex: 1; text-align: right; font-size: .74rem; color: var(--ink-2);
                       overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.m--settings .row .v.miss { color: var(--alert); font-weight: 700; }
.m--settings .row .v.locked { color: var(--ink-3); font-style: italic; }
.m--settings .row .lock { flex: none; font-style: normal; font-size: .6rem; color: var(--ink-3);
                          border: 1px solid var(--grid); padding: .02rem .25rem; }
.m--settings .row .undecided { flex: none; font-style: normal; font-size: .6rem;
                               color: var(--wait-pay); border: 1px dashed var(--wait-pay);
                               padding: .02rem .25rem; }
.m--settings .row.bad { background: #fdf7f5; }
.m--settings .row.warn { background: #fdfaf2; }

.m--settings .fine { margin: .35rem .9rem 0; font-size: .68rem; color: var(--ink-3); line-height: 1.55; }
.m--settings .fine b { color: var(--ink-2); font-weight: 600; }

.m--settings .applybox { margin: 0 .9rem; padding: .6rem .7rem; background: #fff;
                         border: 1px solid var(--grid); }
.m--settings .seg { display: flex; gap: .25rem; }
.m--settings .seg b { min-height: 34px; display: inline-flex; align-items: center; padding: 0 .7rem;
                      border: 1px solid var(--grid); font-size: .78rem; font-weight: 500;
                      color: var(--ink-2); }
.m--settings .seg b.on { background: var(--live); border-color: var(--live); color: #fff; font-weight: 600; }
.m--settings .applybox .h { display: block; font-size: .68rem; color: var(--ink-3);
                            line-height: 1.55; margin-top: .35rem; }
.m--settings .applybox .h b { color: var(--ink-2); }

.m--settings .pad { height: 2.5rem; }
.m--settings .kx { opacity: .72; }
.m--settings .fine a { color: var(--live); font-weight: 700; }
/* 눌러서 들어가지 않는 줄 — 화살표가 있으면 있지도 않은 상세 화면을 약속하게 된다 (SC-M39) */
.m--settings .row.flat::after { content: none; }
