@charset "utf-8";
/* =====================================================================
   모바일 진단자 화면 통일 디자인 — mobile/ms/ms_ux_m_lib.php(msuxm_*) · ms/ms_ux_lib.php(msux_*) 와 짝
   ★ 모든 규칙은 .mux 안에서만 적용된다(아직 안 바꾼 화면에 번지지 않게). 화면 밖에 뜨는 막대·창(.mux-bar · .mux-lm)만 예외.
   PC(ms_ux.css)와 같은 색·부품 이름. 예시 화면(_captures/mobile-ux-2026-10-21)의 m_ux.css 가 초안.
   common.css 의 body *{color:#111} 때문에 글자색은 부품마다 직접 준다.
   ===================================================================== */
.mux { padding-top:12px; padding-bottom:18px; color:#333; }
.mux a { text-decoration:none; }
/* 아이콘(basicons, stroke=currentColor)은 감싼 칸의 색을 따른다 — body *{color:#111} 덮어쓰기 */
.mux svg, .mux svg *, .mux-bar svg, .mux-bar svg *, .mux-lm svg, .mux-lm svg * { color:inherit; }
.mux .hide { display:none !important; }

/* 글자 */
.mux .t-sub { font-size:12px; color:#999; }
.mux .t-mute { font-size:12px; color:#AAA; }
.mux .red { color:#C62828 !important; }
.mux .grn { color:#2E7D32 !important; }

/* 배지 */
.mux .bd { display:inline-flex; align-items:center; gap:3px; font-size:11px; font-weight:700; padding:2px 7px; border-radius:4px; line-height:16px; white-space:nowrap; }
.mux .bd-open  { background:#EBE7E6; color:#715D54; }
.mux .bd-new   { background:#715D54; color:#fff; }
.mux .bd-urgent{ background:#FDECEA; color:#C62828; }
.mux .bd-ready { background:#fff; color:#999; border:1px dashed #CFC6C2; }
.mux .bd-full  { background:#EFEFEF; color:#999; }
.mux .bd-wait  { background:#F1EEEC; color:#8C7469; }
.mux .bd-sel   { background:#EEE; color:#666; }
.mux .bd-can   { background:#E7F0FC; color:#1E6FD9; }
.mux .bd-ing   { background:#FFF1E6; color:#E65100; }
.mux .bd-rev   { background:#E9EEF3; color:#4A6075; }
.mux .bd-fix   { background:#FDECEA; color:#C62828; }
.mux .bd-pay   { background:#F1EEEC; color:#8C7469; }
.mux .bd-paid  { background:#E8F5E9; color:#2E7D32; }
.mux .bd-mine  { background:#fff; color:#715D54; border:1px solid #CDBFB9; }
.mux .moi { display:inline-block; font-size:11px; font-weight:700; padding:1px 6px; border-radius:3px; }
.mux .moi-buy { background:#E7F0FC; color:#1E6FD9; }
.mux .moi-non { background:#EFEFEF; color:#666; }
.mux .moi-var { background:#EFEFEF; color:#666; }
.mux .tg { display:inline-flex; align-items:center; gap:3px; font-size:11px; padding:2px 8px; border-radius:20px; line-height:16px; white-space:nowrap; }
.mux .tg-ok   { background:#E8F5E9; color:#2E7D32; }
.mux .tg-warn { background:#FFF8E1; color:#B06000; }
.mux .tg-red  { background:#FDECEA; color:#C62828; }
.mux .tg-gray { background:#F1EEEC; color:#7F6A60; }
.mux .tg-blue { background:#E7F0FC; color:#1E6FD9; }
.mux .tg-mine { background:#fff; color:#715D54; border:1px solid #CDBFB9; font-weight:700; }

/* 단추 */
.mux .btn, .mux-bar .btn { display:flex; align-items:center; justify-content:center; gap:4px; height:46px; border-radius:10px; font-size:15px; font-weight:700; background:#715D54; color:#fff; width:100%; }
.mux .btn.sm { height:36px; font-size:13px; border-radius:8px; }
.mux .btn.line, .mux-bar .btn.line { background:#fff; color:#715D54; border:1px solid #CDBFB9; }
.mux .btn.off, .mux-bar .btn.off { background:#E3DCD8; color:#A99C96; }
.mux .btn.red { background:#C62828; color:#fff !important; }
.mux .btns { display:flex; gap:8px; }
.mux .btns > * { flex:1; }

/* 카드 · 구역 */
.mux .card { background:#fff; border:1px solid #ECE6E3; border-radius:12px; padding:14px 14px 13px; }
.mux .card + .card, .mux .card + .sec, .mux .sec + .card { margin-top:10px; }
.mux .sec { margin-top:18px; }
.mux .sec-h { display:flex; align-items:center; gap:6px; margin:0 2px 8px; }
.mux .sec-h h3 { font-size:15px; font-weight:700; color:#222; }
.mux .sec-h .n { font-size:13px; font-weight:700; color:#715D54; }
.mux .sec-h .more { margin-left:auto; font-size:12px; color:#999; }
.mux .lbl { font-size:11.5px; color:#AAA; margin:16px 2px 6px; }

/* 맥락 카드(매장) */
.mux .ctx { background:#fff; border:1px solid #ECE6E3; border-radius:12px; overflow:hidden; }
.mux .ctx.fix { border-color:#F3C9C4; }
.mux .ctx .m { padding:13px 14px 11px; }
.mux .ctx .bds { display:flex; align-items:center; gap:6px; flex-wrap:wrap; }
.mux .ctx .hint { font-size:11.5px; color:#999; }
.mux .ctx .hint.red { color:#C62828; }
.mux .ctx .nm { margin-top:6px; font-size:17px; font-weight:700; color:#222; line-height:1.35; }
.mux .ctx .nm .br { color:#999; font-weight:600; font-size:13px; margin-right:5px; }
.mux .ctx .sub { margin-top:3px; font-size:11.5px; color:#999; display:flex; align-items:center; gap:5px; flex-wrap:wrap; }
.mux .dot { width:3px; height:3px; border-radius:50%; background:#D5CFCC; display:inline-block; }
.mux .st3 { display:grid; grid-template-columns:repeat(3, minmax(0,1fr)); border-top:1px solid #F1ECEA; background:#FCFAF9; }
.mux .st3 > div { padding:9px 12px 10px; min-width:0; }
.mux .st3 > div + div { border-left:1px solid #F1ECEA; }
.mux .st3 .k { font-size:10.5px; color:#AAA; white-space:nowrap; }
.mux .st3 .v { font-size:16px; font-weight:700; color:#3E322C; margin-top:2px; white-space:nowrap; letter-spacing:-0.2px; }
.mux .st3 .v.ok { color:#2E7D32; }
.mux .st3 .v.none { color:#C8BEB9; }
.mux .st3 .v.red { color:#C62828; }
.mux .st3 .s { font-size:10.5px; color:#999; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }

/* 단계 막대 · MOT 칩 (가로로 밀어서 보기) */
.mux .steps { display:flex; gap:6px; overflow-x:auto; margin:10px -16px 0; padding:0 16px 2px; scrollbar-width:none; }
.mux .steps::-webkit-scrollbar { display:none; }
.mux .stp { flex-shrink:0; display:inline-flex; align-items:center; gap:5px; height:32px; padding:0 11px 0 8px; border-radius:16px; border:1px solid #E5DFDC; background:#fff; font-size:12.5px; font-weight:700; color:#666; white-space:nowrap; }
.mux .stp i { width:17px; height:17px; border-radius:50%; background:#EEE8E5; color:#fff; font-style:normal; font-size:10px; display:inline-flex; align-items:center; justify-content:center; }
.mux .stp.done i { background:#B9A49A; }
.mux .stp.on { background:#715D54; border-color:#715D54; color:#fff; }
.mux .stp.on i { background:rgba(255,255,255,.28); }
.mux .stp.warn { border-color:#F5C6A5; color:#E65100; }
.mux .stp.warn i { background:#E65100; }
.mux .stp.on.warn { color:#fff; border-color:#715D54; }
.mux .stp.on.warn i { background:#E65100; }
.mux .stp.fixs { border-color:#F3C9C4; color:#C62828; }
.mux .stp em { font-style:normal; font-size:9.5px; font-weight:700; color:#C62828; background:#FDECEA; border-radius:3px; padding:0 4px; line-height:15px; }
.mux .stp.on em { background:rgba(255,255,255,.22); color:#fff; }
.mux .stp.edu { background:#F7F3F1; border-color:#F7F3F1; color:#5B4A3F; }
.mux .mots { display:flex; gap:6px; overflow-x:auto; margin:8px -16px 0; padding:0 16px 2px; scrollbar-width:none; }
.mux .mots::-webkit-scrollbar { display:none; }
.mux .mt { flex-shrink:0; display:inline-flex; align-items:center; gap:4px; height:30px; padding:0 11px; border-radius:15px; background:#fff; border:1px solid #E5DFDC; font-size:12px; font-weight:600; color:#555; white-space:nowrap; }
.mux .mt s { text-decoration:none; color:#B5A9A4; font-size:10.5px; }
.mux .mt.done { background:#F4F1EF; border-color:#F4F1EF; color:#7F6A60; }
.mux .mt.done::before { content:'✓'; font-size:11px; color:#8C7469; }
.mux .mt.cur { background:#715D54; border-color:#715D54; color:#fff; }
.mux .mt.cur s { color:#E9DED9; }
.mux .mt.fix { border-color:#F3C9C4; color:#C62828; }
.mux .mt.fix b { background:#C62828; color:#fff; border-radius:8px; font-size:10px; padding:0 5px; line-height:15px; }
.mux .mt.cur.fix { background:#C62828; border-color:#C62828; color:#fff; }
.mux .mt.cur.fix b { background:#fff; color:#C62828; }
.mux .mt.lock { background:#F7F6F5; border-color:#EEE; color:#BBB; }
.mux .mt .ess { width:6px; height:6px; border-radius:50%; background:#F0A040; display:inline-block; }
.mux .prog { display:flex; align-items:center; gap:8px; margin-top:8px; font-size:11.5px; color:#999; }
.mux .prog b { color:#715D54; }
.mux .prog > span { color:inherit; white-space:nowrap; }
.mux .bar { flex:1; height:4px; border-radius:2px; background:#EAE3E0; overflow:hidden; }
.mux .bar i { display:block; height:100%; background:#715D54; border-radius:2px; }
.mux .bar.red i { background:#E53935; }
.mux .bar.grn i { background:#43A047; }

/* 가로 구간 선택(세그먼트) · 상태 탭 · 검색/필터 */
.mux .seg { display:inline-flex; border:1px solid #E0D9D5; border-radius:8px; overflow:hidden; background:#fff; }
.mux .seg a { padding:6px 11px; font-size:12.5px; color:#888; }
.mux .seg a + a { border-left:1px solid #E0D9D5; }
.mux .seg a.on { background:#715D54; color:#fff; font-weight:700; }
.mux .tabs { display:flex; gap:6px; overflow-x:auto; margin:0 -16px; padding:0 16px 2px; scrollbar-width:none; }
.mux .tabs::-webkit-scrollbar { display:none; }
.mux .tabs a { flex-shrink:0; display:inline-flex; align-items:center; gap:5px; height:34px; padding:0 12px; border-radius:17px; background:#fff; border:1px solid #E5DFDC; font-size:13px; color:#666; white-space:nowrap; }
.mux .tabs a b { font-size:13px; color:#715D54; }
.mux .tabs a.on { background:#3E322C; border-color:#3E322C; color:#fff; font-weight:700; }
.mux .tabs a.on b { color:#fff; }
.mux .tabs a.red b { color:#C62828; }
.mux .tabs a.on.red { background:#C62828; border-color:#C62828; }
.mux .tabs a.on.red b { color:#fff; }
.mux .fbar { display:flex; gap:8px; margin-top:10px; }
.mux .srch { flex:1; display:flex; align-items:center; gap:6px; height:38px; padding:0 12px; background:#fff; border:1px solid #E5DFDC; border-radius:10px; font-size:13px; color:#BBB; }
.mux .fbtn { flex-shrink:0; display:inline-flex; align-items:center; gap:5px; height:38px; padding:0 12px; background:#fff; border:1px solid #E5DFDC; border-radius:10px; font-size:13px; font-weight:600; color:#5B4A3F; }
.mux .fbtn b { background:#715D54; color:#fff; border-radius:9px; font-size:10.5px; padding:0 6px; line-height:17px; }
.mux .tbar { display:flex; align-items:center; gap:8px; margin-top:10px; flex-wrap:wrap; }
.mux .tbar .r { margin-left:auto; }
.mux .base { display:flex; align-items:center; gap:6px; margin-top:8px; font-size:12px; color:#888; }
.mux .base b { color:#5B4A3F; }
.mux .base a { color:#715D54; text-decoration:underline; margin-left:auto; }

/* 필터 카드 — PC .fbar(흰 카드 · 1줄: 검색/선택/토글/지도/초기화 · 2줄: 옅은 바탕에 개수·정렬·거리 기준)와 같은 부품·색 */
.mux .fcard { background:#fff; border:1px solid #ECE6E3; border-radius:12px; margin-top:10px; overflow:hidden; }
.mux .fcard .r1 { display:flex; flex-wrap:wrap; align-items:center; gap:6px; padding:10px; }
.mux .fcard .r1.tint, .mux .fcard .r2 { border-top:1px solid #F1ECEA; background:#FCFBFA; }
.mux .fcard .r2 { display:flex; flex-wrap:wrap; align-items:center; gap:6px 8px; padding:9px 12px 10px; font-size:12px; color:#999; }
.mux .fcard .sp { flex:1; }
.mux .fcard .ln { width:100%; display:flex; align-items:center; gap:6px; flex-wrap:wrap; }
.mux .fcard .cnt { font-size:12.5px; color:#555; } .mux .fcard .cnt b { color:#715D54; }
.mux .fcard .ul { font-size:12px; color:#715D54; text-decoration:underline; }
.mux .fcard .ul.b { font-weight:700; color:#3E322C; }
.mux .fcard .nt { width:100%; font-size:11px; color:#AAA; }
.mux .fsrch { flex:1; min-width:0; display:flex; align-items:center; gap:7px; height:38px; padding:0 12px; background:#F7F4F2; border-radius:8px; font-size:13px; color:#B5AAA5; }
.mux .fsrch svg, .mux .fsrch svg * { color:#A89890; }
.mux .fdd { display:inline-flex; align-items:center; gap:6px; height:34px; padding:0 10px 0 11px; background:#F7F4F2; border-radius:8px; font-size:12.5px; color:#333; white-space:nowrap; }
.mux .fdd .k { color:#999; }
.mux .fdd .k::after { content:''; display:inline-block; width:1px; height:10px; background:#DDD3CF; margin-left:7px; vertical-align:-1px; }
.mux .fdd::after { content:''; width:0; height:0; border-left:3.5px solid transparent; border-right:3.5px solid transparent; border-top:4px solid #555; margin-left:1px; }
.mux .ftog { display:inline-flex; align-items:center; gap:6px; height:34px; padding:0 12px 0 9px; border-radius:17px; border:1px solid #E5DFDC; background:#fff; font-size:12.5px; color:#666; white-space:nowrap; }
.mux .ftog .ck { width:15px; height:15px; border-radius:50%; border:1.5px solid #CFC6C2; display:inline-flex; align-items:center; justify-content:center; font-size:9px; font-weight:800; color:#fff; box-sizing:border-box; }
.mux .ftog.on { background:#F7F3F1; border-color:#715D54; color:#715D54; font-weight:700; }
.mux .ftog.on .ck { background:#715D54; border-color:#715D54; }
.mux .ftog .n { font-size:11.5px; font-weight:600; color:#B5A39B; }
.mux .fmap { display:inline-flex; align-items:center; gap:5px; height:34px; padding:0 11px 0 10px; border:1px solid #CDBFB9; border-radius:8px; background:#fff; color:#715D54; font-size:12.5px; font-weight:700; white-space:nowrap; }
.mux .fmap svg, .mux .fmap svg *, .mux .freset svg, .mux .freset svg * { color:inherit; }
.mux .freset { display:inline-flex; align-items:center; gap:4px; height:38px; padding:0 4px 0 6px; font-size:12.5px; color:#7F6A60; white-space:nowrap; }
.mux .home { display:inline-flex; align-items:center; gap:4px; height:26px; padding:0 9px; background:#F3EEEB; border-radius:13px; font-size:12px; color:#999; white-space:nowrap; }
.mux .home b { color:#3E322C; font-weight:700; }
.mux .home svg, .mux .home svg * { color:#8C7469; }
.mux .fcard .lb { font-size:12px; color:#999; }
.mux .seg.sm a { padding:5px 10px; font-size:12px; }
/* PC .ux-seg(옅은 바탕 안의 구간 선택) */
.mux .useg { display:flex; background:#F7F4F2; border-radius:8px; padding:3px; gap:2px; width:100%; }
.mux .useg a { flex:1; text-align:center; padding:7px 0; border-radius:6px; font-size:13px; color:#888; white-space:nowrap; }
.mux .useg a b { font-weight:700; color:#BBB; font-size:12px; margin-left:3px; }
.mux .useg a.on { background:#715D54; color:#fff; font-weight:600; }
.mux .useg a.on b { color:#E9DED9; }
/* 진행중 상태 칸(PC .opipe — 이름·숫자·설명, 가로로 밀어 보기) */
.mux .opipe { display:flex; overflow-x:auto; scrollbar-width:none; }
.mux .opipe::-webkit-scrollbar { display:none; }
.mux .opipe a { flex-shrink:0; min-width:86px; padding:10px 12px 9px; position:relative; }
.mux .opipe a + a { border-left:1px solid #F1ECEA; }
.mux .opipe .gap { flex-shrink:0; width:8px; background:#FAF7F5; border-left:1px solid #F1ECEA; }
.mux .opipe .nm { font-size:11.5px; color:#888; font-weight:600; white-space:nowrap; }
.mux .opipe .n { font-size:19px; font-weight:700; color:#222; line-height:24px; margin-top:1px; }
.mux .opipe .cap { font-size:10px; color:#AAA; white-space:nowrap; }
.mux .opipe a.on { background:#FBF9F8; box-shadow:inset 0 -3px 0 #715D54; }
.mux .opipe a.on .nm { color:#3E322C; }
.mux .opipe a.fix .nm, .mux .opipe a.fix .n { color:#C62828; }
.mux .opipe a.zero .n { color:#D5CDC9; }
.mux .fcard .br { flex-basis:100%; height:0; }
.mux .vsw { display:flex; justify-content:flex-end; }
/* 요약 카드 보조 · 할 일 줄 단추 · 작은 진행 막대 · 달력 머리 */
.mux .sum .s.wrap { white-space:normal; line-height:1.35; }
.mux .sum .v.brand { color:#715D54; }
.mux .sum.c3 { grid-template-columns:1fr 1fr; }
.mux .sum.c3 > div.full { grid-column:1 / -1; display:flex; align-items:center; gap:10px; }
.mux .sum.c3 > div.full .v { margin-top:0; }
.mux .todo .r .rb { flex-shrink:0; height:30px; padding:0 11px; border-radius:7px; background:#715D54; color:#fff; font-size:12px; font-weight:700; display:inline-flex; align-items:center; white-space:nowrap; }
.mux .todo .r .rb.line { background:#fff; color:#715D54; border:1px solid #CDBFB9; }
.mux .todo .r .rb.off { background:#E3DCD8; color:#A99C96; }
.mux .mp { display:inline-block; width:42px; height:4px; border-radius:2px; background:#EAE3E0; vertical-align:middle; overflow:hidden; margin-right:4px; }
.mux .mp i { display:block; height:100%; background:#715D54; }
.mux .mp.red i { background:#E53935; }
.mux .calnav { display:flex; align-items:center; gap:8px; padding:2px 2px 8px; }
.mux .calnav i { width:28px; height:28px; border-radius:50%; border:1px solid #E5DFDC; background:#fff; display:inline-flex; align-items:center; justify-content:center; font-style:normal; color:#8C7469; font-size:13px; }
.mux .calnav b { font-size:15px; color:#222; }
.mux .calnav .today { height:26px; padding:0 10px; border:1px solid #E5DFDC; border-radius:13px; font-size:12px; color:#5B4A3F; display:inline-flex; align-items:center; }
.mux .todo .r .dd { width:40px; flex-shrink:0; text-align:center; }
.mux .todo .r .dd b { font-size:17px; color:#3E322C; }
.mux .todo .r .dd.red b, .mux .todo .r .dd.red div { color:#C62828; }
.mux .todo .r .dd div { font-size:10.5px; color:#AAA; }
.mux .vsw .seg a { display:inline-flex; align-items:center; gap:4px; }
.mux .vsw .seg svg, .mux .vsw .seg svg * { color:inherit; }

/* 목록 카드(프로젝트·매장·진행중) */
.mux .lc { background:#fff; border:1px solid #ECE6E3; border-radius:12px; padding:14px 14px 12px; }
.mux .lc + .lc { margin-top:10px; }
.mux .lc.dim { background:#FAF8F7; }
.mux .lc.dim .nm, .mux .lc.dim .big { color:#AAA !important; }
.mux .lc.urgent { border-color:#F3C9C4; }
.mux .lc.fix { border-color:#F3C9C4; }
.mux .lc.pick { border-color:#715D54; box-shadow:0 0 0 1px #715D54 inset; }
.mux .lc .bds { display:flex; align-items:center; gap:5px; flex-wrap:wrap; }
.mux .lc .when { font-size:11px; color:#AAA; }
.mux .lc .nm { margin-top:6px; font-size:15.5px; font-weight:700; color:#222; line-height:1.4; }
.mux .lc .nm .br { color:#999; font-weight:600; font-size:12.5px; margin-right:4px; }
.mux .lc .sub { margin-top:4px; font-size:11.5px; color:#999; display:flex; align-items:center; gap:5px; flex-wrap:wrap; }
.mux .lc .tags { display:flex; gap:5px; flex-wrap:wrap; margin-top:8px; }
.mux .lc .st { display:grid; grid-template-columns:repeat(3, minmax(0,1fr)); margin-top:10px; background:#FAF8F7; border-radius:10px; }
.mux .lc .st > div { padding:9px 10px 8px; min-width:0; }
.mux .lc .st > div + div { border-left:1px solid #EFE9E6; }
.mux .lc .st .k { font-size:10.5px; color:#AAA; white-space:nowrap; }
.mux .lc .st .big { font-size:18px; font-weight:700; color:#715D54; line-height:23px; margin-top:2px; white-space:nowrap; letter-spacing:-0.3px; }
.mux .lc .st .big small { font-size:11px; font-weight:600; margin-left:1px; color:inherit; }
.mux .lc .st .big.red { color:#C62828; }
.mux .lc .st .big.ink { color:#222; }
.mux .lc .st .big.mute { color:#C8BEB9; }
.mux .lc .st .sm { font-size:10.5px; color:#999; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.mux .lc .act { display:flex; align-items:center; gap:8px; margin-top:10px; }
.mux .lc .act .an { flex:1; font-size:11.5px; color:#999; line-height:1.4; }
.mux .lc .act .an.red { color:#C62828; }
.mux .lc .act .btn { width:auto; flex-shrink:0; padding:0 16px; }
.mux .lc .ck { position:absolute; }
.mux .wk { display:inline-flex; gap:3px; }
.mux .wk span { width:19px; height:19px; border-radius:5px; background:#F4F1EF; color:#CFC5C1; font-size:10.5px; display:inline-flex; align-items:center; justify-content:center; }
.mux .wk span.on { background:#EBE7E6; color:#715D54; font-weight:700; }
.mux .slim { display:flex; align-items:center; gap:8px; padding:11px 13px; background:#fff; border-radius:10px; font-size:12.5px; color:#999; }
.mux .slim + .slim { margin-top:6px; }
.mux .slim .nm2 { flex:1; min-width:0; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; color:#999; }

/* 요약 카드(메인·완료) */
.mux .sum { display:grid; grid-template-columns:1fr 1fr; gap:8px; }
.mux .sum > div { background:#fff; border:1px solid #ECE6E3; border-radius:12px; padding:11px 12px 10px; min-width:0; }
.mux .sum > div.hot { border-color:#F3C9C4; }
.mux .sum .k { font-size:11px; color:#999; display:flex; align-items:center; gap:4px; }
.mux .sum .k .dt { width:5px; height:5px; border-radius:50%; background:#E53935; }
.mux .sum .v { font-size:20px; font-weight:700; color:#3E322C; margin-top:2px; letter-spacing:-0.3px; }
.mux .sum .v small { font-size:12px; color:#999; font-weight:600; }
.mux .sum .v.red { color:#C62828; }
.mux .sum .v.grn { color:#2E7D32; }
.mux .sum .s { font-size:10.5px; color:#999; margin-top:1px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }

/* 할 일 줄 */
.mux .todo { background:#fff; border:1px solid #ECE6E3; border-radius:12px; overflow:hidden; }
.mux .todo .r { display:flex; align-items:center; gap:10px; padding:12px 13px; }
.mux .todo .r + .r { border-top:1px solid #F4F0EE; }
.mux .todo .r .tx { flex:1; min-width:0; }
.mux .todo .r .t1 { font-size:13.5px; font-weight:700; color:#222; display:flex; align-items:center; gap:5px; }
.mux .todo .r .t2 { font-size:11.5px; color:#999; margin-top:2px; }
.mux .todo .r .t2.red { color:#C62828; }
.mux .todo .r .go { flex-shrink:0; font-size:12.5px; font-weight:700; color:#715D54; }

/* 정보 키-값 · 안내 */
.mux .kv { display:grid; grid-template-columns:98px minmax(0,1fr); row-gap:9px; column-gap:10px; font-size:13px; align-items:center; }
.mux .kv .k { color:#AAA; font-size:12px; }
.mux .kv .v { color:#333; }
.mux .ch { display:flex; align-items:center; gap:7px; font-size:13.5px; font-weight:700; color:#222; margin-bottom:10px; }
.mux .ch .ic { width:24px; height:24px; border-radius:7px; background:#F7F3F1; display:inline-flex; align-items:center; justify-content:center; color:#8C7469; font-size:12px; }
.mux .ch .r { margin-left:auto; font-size:12px; font-weight:600; color:#715D54; }
.mux .note { display:flex; gap:8px; background:#FFFBF2; border:1px solid #F1E3C4; border-radius:10px; padding:11px 12px; font-size:12.5px; color:#5B4A3F; line-height:1.6; }
.mux .note b { display:block; font-size:12px; color:#A07A2A; margin-bottom:2px; }
.mux .ret { background:#FFF6F5; border:1px solid #F3C9C4; border-radius:10px; padding:10px 12px; font-size:12.5px; color:#7A2F2A; line-height:1.55; }
.mux .ret b { color:#C62828; margin-right:6px; }
.mux .lockbar { display:flex; gap:9px; align-items:flex-start; background:#FFF7EE; border:1px solid #F5D6B5; border-radius:10px; padding:11px 12px; font-size:12.5px; color:#7A4A12; line-height:1.55; }
.mux .lockbar b { color:#E65100; display:block; }
.mux .feat { display:grid; grid-template-columns:1fr 1fr; gap:6px; }
.mux .feat .ft { display:flex; align-items:center; gap:8px; padding:8px 10px; border-radius:8px; background:#FAF7F5; min-width:0; }
.mux .feat .ft.wide { grid-column:1 / -1; }
.mux .feat .ft .k { font-size:10.5px; color:#AAA; }
.mux .feat .ft .v { font-size:12.5px; font-weight:700; color:#333; }
.mux .feat .ft .v.yes { color:#2E7D32; }
.mux .feat .ft .v.no { color:#B5B5B5; font-weight:500; }
.mux .maps { display:flex; gap:6px; margin-top:10px; }
.mux .mapbtn { flex:1; display:inline-flex; align-items:center; justify-content:center; gap:5px; height:34px; border:1px solid #E5DFDC; border-radius:8px; background:#fff; font-size:12.5px; font-weight:600; color:#444; }
.mux .mapbtn i { font-style:normal; font-size:10px; font-weight:800; width:15px; height:15px; border-radius:3px; display:inline-flex; align-items:center; justify-content:center; }
.mux .mapbtn.nv i { background:#03C75A; color:#fff; }
.mux .mapbtn.kk i { background:#FEE500; color:#3C1E1E; }

/* 지도 자리(예시) */
.mux .map { position:relative; height:220px; border-radius:12px; overflow:hidden; background:linear-gradient(135deg,#EDEBE4 0%,#E4E8E0 50%,#ECE7DF 100%); border:1px solid #E5DFDC; }
.mux .map .rd { position:absolute; background:#fff; opacity:.9; }
.mux .map .pin { position:absolute; width:22px; height:22px; border-radius:50% 50% 50% 0; transform:rotate(-45deg); background:#715D54; border:2px solid #fff; box-shadow:0 1px 3px rgba(0,0,0,.25); }
.mux .map .pin.can { background:#1E6FD9; } .mux .map .pin.ing { background:#E65100; } .mux .map .pin.fix { background:#C62828; } .mux .map .pin.gray { background:#9E9E9E; }
.mux .map .me { position:absolute; width:16px; height:16px; border-radius:50%; background:#2E7D32; border:3px solid #fff; box-shadow:0 0 0 6px rgba(46,125,50,.18); }
.mux .map .lab { position:absolute; background:#fff; border-radius:6px; padding:2px 7px; font-size:11px; font-weight:700; color:#3E322C; box-shadow:0 1px 3px rgba(0,0,0,.18); white-space:nowrap; }
.mux .map .lg { position:absolute; left:8px; bottom:8px; background:rgba(255,255,255,.92); border-radius:6px; padding:3px 8px; font-size:10.5px; color:#555; display:flex; gap:8px; }
.mux .map .lg i { display:inline-block; width:8px; height:8px; border-radius:50%; margin-right:3px; }

/* 하단 고정 막대(하단 탭 위) */
.mux-bar { position:fixed; left:0; right:0; bottom:60px; z-index:30; padding:10px 16px 12px; background:linear-gradient(180deg, rgba(243,239,236,0) 0%, #F3EFEC 30%); }
.mux-bar .in { display:flex; align-items:center; gap:8px; background:#3E322C; border-radius:14px; padding:9px 9px 9px 14px; box-shadow:0 6px 18px rgba(0,0,0,.18); }
.mux-bar .tx { flex:1; min-width:0; }
.mux-bar .tx b { display:block; font-size:13px; color:#fff; font-weight:700; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.mux-bar .tx small { display:block; font-size:10.5px; color:#CDBFB9; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.mux-bar a { flex-shrink:0; height:38px; padding:0 14px; border-radius:9px; display:inline-flex; align-items:center; font-size:13.5px; font-weight:700; }
.mux-bar a.b1 { border:1px solid #6D5C53; color:#E9DED9; }
.mux-bar a.b2 { background:#5F4D45; color:#fff; }
.mux-bar a.b3 { background:#fff; color:#3E322C; }
.mux-bar.plain { background:#F3EFEC; padding-top:8px; }
.mux-bar.plain .in { background:none; box-shadow:none; padding:0; }
.mux-bar.plain .btn { height:48px; }

/* 달력 */
.mux .cal { border:1px solid #F1ECEA; border-radius:10px; overflow:hidden; margin-top:10px; }
.mux .cal .hd { display:flex; align-items:center; justify-content:space-between; padding:8px 10px; background:#FBF9F8; border-bottom:1px solid #F1ECEA; }
.mux .cal .hd b { font-size:14px; color:#222; }
.mux .cal .hd i { width:28px; height:28px; border-radius:50%; border:1px solid #E5DFDC; background:#fff; display:inline-flex; align-items:center; justify-content:center; font-style:normal; color:#8C7469; font-size:13px; }
.mux .cal .wd, .mux .cal .gd { display:grid; grid-template-columns:repeat(7,1fr); }
.mux .cal .wd span { text-align:center; font-size:10.5px; color:#AAA; padding:6px 0 3px; }
.mux .cal .wd span:first-child { color:#E57373; } .mux .cal .wd span:last-child { color:#7A9CC6; }
.mux .cal .gd span { height:42px; display:flex; flex-direction:column; align-items:center; justify-content:center; font-size:13.5px; color:#333; border-top:1px solid #F6F3F2; position:relative; }
.mux .cal .gd span.x { color:#D2CBC8; }
.mux .cal .gd span.vd { background:#FBF8F6; }
.mux .cal .gd span.vd::after { content:''; position:absolute; bottom:5px; width:4px; height:4px; border-radius:50%; background:#C3ACA2; }
.mux .cal .gd span.x.vd { background:none; } .mux .cal .gd span.x.vd::after { background:#E2DCD9; }
.mux .cal .gd span small { font-size:8.5px; line-height:1; margin-top:1px; color:inherit; }
.mux .cal .gd span.today { font-weight:700; color:#715D54; }
.mux .cal .gd span.end { color:#C62828; font-weight:700; }
.mux .cal .gd span.sel { background:#715D54; color:#fff; font-weight:700; border-radius:10px; }
.mux .cal .gd span.sel::after { background:#fff; }
.mux .cal .gd span .ev { position:absolute; left:3px; right:3px; bottom:3px; height:4px; border-radius:2px; }
.mux .pickd { display:flex; align-items:center; gap:8px; margin-top:10px; padding:10px 12px; background:#F7F3F1; border-radius:10px; flex-wrap:wrap; }
.mux .pickd .k { font-size:11.5px; color:#8C7469; }
.mux .pickd b { font-size:15px; color:#3E322C; }
.mux .pickd .tm { font-size:11.5px; color:#999; }
.mux .pickd .wn { width:100%; font-size:11.5px; color:#B06000; }

/* 문항 카드 */
.mux .q { background:#fff; border:1px solid #ECE6E3; border-radius:12px; padding:14px 13px 13px; }
.mux .q + .q { margin-top:10px; }
.mux .q.fix { border-color:#F3C9C4; }
.mux .q.lock { background:#FBFAF9; }
.mux .q .qh { display:flex; gap:8px; align-items:flex-start; }
.mux .q .qn { flex-shrink:0; min-width:24px; height:22px; padding:0 5px; border-radius:6px; background:#715D54; color:#fff; font-size:11.5px; font-weight:700; display:inline-flex; align-items:center; justify-content:center; }
.mux .q.fix .qn { background:#FDECEA; color:#C62828; }
.mux .q.lock .qn { background:#EEE; color:#AAA; }
.mux .q .qt { font-size:14.5px; font-weight:700; color:#222; line-height:1.45; }
.mux .q.lock .qt { color:#999; }
.mux .q .qb { display:flex; gap:4px; flex-wrap:wrap; margin:7px 0 0 32px; }
.mux .q .qb span { font-size:10.5px; font-weight:700; padding:1px 6px; border-radius:4px; }
.mux .q .qb .ess { border:1px solid #F0B5AE; color:#C62828; }
.mux .q .qb .ask { background:#FFF3E0; color:#E65100; }
.mux .q .qb .ph { background:#E7F0FC; color:#1E6FD9; }
.mux .q .qb .imp { background:#F1EEEC; color:#7F6A60; }
.mux .q .qb .lk { background:#F1F1F1; color:#999; }
.mux .q .qc { margin:8px 0 0 32px; font-size:12.5px; color:#555; line-height:1.6; }
.mux .q .qi { margin:8px 0 0 32px; display:flex; gap:6px; }
.mux .q .qi span { width:64px; height:64px; border-radius:8px; background:#F1ECEA; border:1px solid #E5DFDC; }
.mux .q .ret { margin-top:10px; }
.mux .q .sl { font-size:11px; color:#AAA; margin:12px 0 6px; }
.mux .q .op { display:flex; align-items:center; gap:9px; min-height:42px; padding:9px 12px; border:1px solid #E5DFDC; border-radius:10px; font-size:13.5px; color:#333; background:#fff; }
.mux .q .op + .op { margin-top:6px; }
.mux .q .op i { flex-shrink:0; width:18px; height:18px; border:1.5px solid #CFC6C2; border-radius:50%; }
.mux .q .op.cb i { border-radius:5px; }
.mux .q .op.on { border-color:#715D54; background:#F7F3F1; font-weight:700; }
.mux .q .op.on i { border-color:#715D54; background:#715D54; box-shadow:inset 0 0 0 3px #F7F3F1; }
.mux .q .op.cb.on i { box-shadow:none; background:#715D54 url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path d='M5 12l5 5L20 7' stroke='white' stroke-width='3' fill='none'/></svg>") center/12px no-repeat; }
.mux .q.lock .op { background:#F7F6F5; color:#AAA; border-color:#EEE; }
.mux .q .ai { margin-left:auto; font-size:10px; font-weight:700; color:#6A4FC9; background:#F1ECFF; border-radius:4px; padding:1px 5px; }
.mux .q .lk5 { display:grid; grid-template-columns:repeat(5,1fr); gap:6px; }
.mux .q .lk5 span { height:42px; border:1px solid #E5DFDC; border-radius:9px; display:flex; align-items:center; justify-content:center; font-size:14px; font-weight:700; color:#666; background:#fff; }
.mux .q .lk5 span.on { background:#715D54; border-color:#715D54; color:#fff; }
.mux .q .lkl { display:flex; justify-content:space-between; font-size:10.5px; color:#999; margin-top:5px; }
.mux .q .ta { min-height:84px; border:1px solid #E5DFDC; border-radius:10px; padding:10px 12px; font-size:13.5px; color:#333; background:#fff; line-height:1.55; }
.mux .q .ta.err { border-color:#E57373; }
.mux .q .tai { display:flex; justify-content:space-between; margin-top:4px; font-size:11px; color:#AAA; }
.mux .q .tai .e { color:#E53935; }
.mux .q .att { display:flex; gap:6px; margin-top:10px; flex-wrap:wrap; }
.mux .q .att .add { width:64px; height:64px; border:1.5px dashed #CFC6C2; border-radius:9px; display:flex; flex-direction:column; align-items:center; justify-content:center; font-size:10.5px; color:#8C7469; gap:1px; }
.mux .q .att .add b { font-size:18px; color:#8C7469; line-height:1; }
.mux .q .att .im { width:64px; height:64px; border-radius:9px; background:#E9E3DF; position:relative; }
.mux .q .att .im::after { content:'×'; position:absolute; right:-5px; top:-5px; width:18px; height:18px; border-radius:50%; background:#3E322C; color:#fff; font-size:12px; display:flex; align-items:center; justify-content:center; }
.mux .mh { display:flex; align-items:baseline; gap:8px; margin:14px 2px 0; flex-wrap:wrap; }
.mux .mh h3 { font-size:16px; font-weight:700; color:#222; }
.mux .mh span { font-size:11.5px; color:#999; }
.mux .guide { margin-top:10px; background:#FFFBF2; border:1px solid #F1E3C4; border-radius:12px; padding:11px 12px; font-size:12.5px; color:#5B4A3F; line-height:1.6; }
.mux .guide .t { font-size:13px; font-weight:700; color:#5B4A3F; margin-bottom:4px; }
.mux .guide .t em { font-style:normal; background:#E8A23B; color:#fff; font-size:10.5px; padding:1px 6px; border-radius:4px; margin-right:6px; }

/* 영수증 */
.mux .bills { display:grid; grid-template-columns:1fr 1fr; gap:8px; margin-top:10px; }
.mux .bill { background:#fff; border:1px solid #ECE6E3; border-radius:12px; padding:11px 11px 10px; min-width:0; }
.mux .bill .t { font-size:13px; font-weight:700; color:#222; }
.mux .bill .t small { display:block; font-size:10.5px; color:#AAA; font-weight:500; }
.mux .bill .amt { display:flex; align-items:center; gap:4px; height:36px; margin-top:7px; border:1px solid #E5DFDC; border-radius:8px; padding:0 9px; font-size:14px; font-weight:700; color:#333; justify-content:flex-end; }
.mux .bill .amt small { font-size:11px; color:#AAA; font-weight:500; }
.mux .bill .up { margin-top:7px; height:66px; border:1.5px dashed #CFC6C2; border-radius:9px; display:flex; flex-direction:column; align-items:center; justify-content:center; font-size:11.5px; color:#8C7469; font-weight:700; }
.mux .bill .up small { font-size:10px; color:#BBB; font-weight:500; }
.mux .bill .img { margin-top:7px; height:66px; border-radius:9px; background:#E9E3DF; position:relative; }
.mux .bill .img::after { content:'×'; position:absolute; right:-5px; top:-5px; width:18px; height:18px; border-radius:50%; background:#3E322C; color:#fff; font-size:12px; display:flex; align-items:center; justify-content:center; }
.mux .bsum { display:flex; align-items:center; justify-content:space-between; margin-top:10px; background:#fff; border:1px solid #ECE6E3; border-radius:12px; padding:11px 13px; font-size:12.5px; color:#888; }
.mux .bsum b { font-size:17px; color:#3E322C; }

/* 아래에서 올라오는 창(예시) */
.mux-sheet-dim { position:fixed; top:0; right:0; bottom:0; left:0; background:rgba(0,0,0,.35); z-index:40; }
.mux-sheet { position:fixed; left:0; right:0; bottom:0; z-index:41; background:#fff; border-radius:16px 16px 0 0; padding:10px 16px 18px; box-shadow:0 -6px 20px rgba(0,0,0,.15); }
.mux-sheet .grab { width:40px; height:4px; border-radius:2px; background:#DDD; margin:0 auto 10px; }
.mux-sheet h4 { font-size:15px; font-weight:700; color:#222; margin-bottom:10px; }
.mux .guide .qi { display:flex; gap:6px; }
.mux .guide .qi span { width:56px; height:56px; border-radius:8px; background:#EFE6D2; border:1px solid #E8DCC2; display:inline-block; }
/* 진단 화면(step0~3)·서약·퀴즈의 아래 단추는 고정하지 않고 내용 끝에 이어 붙인다(2026-08 모바일 '하단버튼 흐름배치' 결정과 같게) */
.mux-bar.flow { position:static; bottom:auto; z-index:auto; padding:18px 0 6px; background:none; }
.mux-bar.flow.plain { padding-top:18px; }
.mux .todo .r .t2.one { white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }

/* ── 10-22 2차: 펼친 상세(PC .xp-* 와 같은 구성) ── */
.mux .lc .tgl { font-size:10px; color:#B5A9A4; margin-left:5px; vertical-align:2px; }
.mux .lc.open { border-color:#CDBFB9; }
.mux .xpd { margin:12px -14px -12px; padding:12px 12px 12px; background:#FBF9F8; border-top:1px solid #F1ECEA; border-radius:0 0 12px 12px; }
.mux .xc { background:#fff; border:1px solid #EFE9E6; border-radius:10px; padding:11px 12px; }
.mux .xc + .xc { margin-top:8px; }
.mux .xh { display:flex; align-items:center; gap:6px; font-size:12.5px; font-weight:700; color:#3E322C; margin-bottom:8px; }
.mux .xh svg, .mux .xh svg * { color:#8C7469; }
.mux .xh .r { margin-left:auto; font-size:10.5px; color:#AAA; font-weight:500; }
.mux .near { display:grid; grid-template-columns:52px minmax(0,1fr) auto auto; gap:7px 8px; align-items:center; font-size:12.5px; color:#333; }
.mux .near b { font-size:14px; color:#3E322C; } .mux .near b small { font-size:10px; color:#999; font-weight:500; margin-left:1px; }
.mux .near .a small { font-size:10.5px; color:#8C7469; margin-left:3px; }
.mux .near .s { font-size:11.5px; font-weight:700; color:#2E7D32; } .mux .near .s.mine { color:#3E322C; }
.mux .cond { display:grid; grid-template-columns:1fr 1fr; gap:7px 14px; font-size:12px; }
.mux .cond > div { display:flex; align-items:center; gap:4px; padding-bottom:6px; border-bottom:1px solid #F4F0EE; }
.mux .cond .k { color:#999; flex:1; } .mux .cond .v { color:#333; } .mux .cond .ok { color:#2E7D32; font-size:11px; }
.mux .kv2 { display:grid; grid-template-columns:100px minmax(0,1fr); row-gap:7px; column-gap:8px; font-size:12.5px; color:#333; }
.mux .kv2 .k { color:#999; font-size:12px; }
.mux .dchip { display:inline-block; font-size:10.5px; font-weight:700; background:#EFE9E6; color:#5B4A3F; border-radius:4px; padding:0 5px; margin-left:4px; }
.mux .xfoot { margin-top:9px; font-size:11.5px; color:#999; display:flex; align-items:center; gap:8px; }
.mux .xnote { margin-top:8px; background:#FFF6F5; border:1px solid #F3C9C4; border-radius:10px; padding:10px 12px; font-size:12px; color:#7A2F2A; line-height:1.55; }
.mux .xnote b { display:block; color:#C62828; }
.mux .xmemo { margin-top:8px; background:#FFFBF2; border:1px solid #F1E3C4; border-radius:10px; padding:10px 12px; font-size:12px; color:#5B4A3F; line-height:1.55; }
.mux .xmemo b { display:block; color:#A07A2A; font-size:11.5px; }
.mux .rcpt { display:grid; grid-template-columns:minmax(0,1fr) auto; row-gap:6px; font-size:12.5px; color:#333; }
.mux .rcpt .k small { color:#AAA; font-size:10.5px; margin-left:4px; }
.mux .rcpt .z { color:#C8BEB9; }
.mux .rcpt .tot { border-top:1px solid #F1ECEA; padding-top:7px; font-weight:700; }
.mux .rbig { font-size:22px; font-weight:700; color:#715D54; }
.mux .info2 { margin-top:8px; display:flex; gap:7px; background:#F5F7FA; border:1px solid #E3E8EF; border-radius:10px; padding:10px 12px; font-size:11.5px; color:#555; line-height:1.55; }
/* 진행 단계(가로로 밀어 보기) */
.mux .tl { display:flex; overflow-x:auto; scrollbar-width:none; padding:4px 0 2px; }
.mux .tl::-webkit-scrollbar { display:none; }
.mux .tl .s { flex-shrink:0; width:62px; text-align:center; position:relative; font-size:10.5px; color:#999; }
.mux .tl .s::before { content:''; position:absolute; left:-31px; right:31px; top:10px; height:2px; background:#C3ACA2; }
.mux .tl .s:first-child::before { display:none; }
.mux .tl .s.nx::before { background:#E7E1DE; }
.mux .tl .s i { position:relative; z-index:1; display:inline-flex; width:20px; height:20px; border-radius:50%; background:#B9A49A; color:#fff; font-style:normal; font-size:10px; align-items:center; justify-content:center; }
.mux .tl .s.nx i { background:#EEE8E5; color:#C8BEB9; }
.mux .tl .s.red i { background:#C62828; box-shadow:0 0 0 3px #FDECEA; }
.mux .tl .s .l { display:block; margin-top:3px; color:#555; white-space:nowrap; }
.mux .tl .s.red .l { color:#C62828; font-weight:700; }
.mux .tl .s .d { display:block; font-size:9.5px; color:#AAA; white-space:nowrap; }
.mux .tl .s.red .d { color:#C62828; }
/* 거리 기준 — 현재 위치 */
.mux .home.cur { background:#E8F5E9; color:#2E7D32; }
.mux .home.cur b { color:#1B5E20; } .mux .home.cur svg, .mux .home.cur svg * { color:#2E7D32; }
.mux .fix2 { display:inline-flex; align-items:center; gap:3px; font-size:12px; font-weight:700; color:#715D54; }
.mux .fix2 svg, .mux .fix2 svg * { color:inherit; }
.mux .ul.quiet { color:#AAA; }
/* 필터 — 가로로 밀어 보는 한 줄(완료·매장 목록) */
.mux .fcard .r2s { display:flex; align-items:center; gap:6px; padding:8px 10px; border-top:1px solid #F1ECEA; background:#FCFBFA; overflow-x:auto; scrollbar-width:none; }
.mux .fcard .r2s::-webkit-scrollbar { display:none; }
.mux .fcard .r2s > * { flex-shrink:0; }
.mux .fsrch.sm { flex:0 0 116px; height:34px; font-size:12.5px; }
.mux .sum1 { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); background:#fff; border:1px solid #ECE6E3; border-radius:12px; overflow:hidden; }
.mux .sum1 > div { padding:10px 11px 9px; min-width:0; }
.mux .sum1 > div + div { border-left:1px solid #F1ECEA; }
.mux .sum1 .k { font-size:10.5px; color:#999; line-height:1.3; }
.mux .sum1 .v { font-size:16.5px; font-weight:700; color:#3E322C; margin-top:3px; letter-spacing:-0.3px; white-space:nowrap; }
.mux .sum1 .v.brand { color:#715D54; } .mux .sum1 .v.grn { color:#2E7D32; }
.mux .sum1 .s { font-size:10.5px; color:#999; margin-top:1px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }

/* ── 10-22 2차: 결과입력 — MOT 판(줄바꿈으로 한눈에) · 문항 머리(번호 + 배지 한 줄, 제목은 아래 전체 폭) ── */
.mux .motp { margin-top:8px; background:#fff; border:1px solid #ECE6E3; border-radius:12px; padding:9px 10px 10px; }
.mux .motp .hd { display:flex; align-items:center; gap:6px; font-size:11.5px; color:#999; margin:0 2px 8px; }
.mux .motp .hd b { color:#3E322C; font-size:12.5px; }
.mux .motp .hd a { margin-left:auto; color:#8C7469; font-size:11.5px; }
.mux .motp .wrap { display:flex; flex-wrap:wrap; gap:5px; }
.mux .motp .mt { height:28px; padding:0 9px; font-size:12px; max-width:100%; }
.mux .motp .mt .nm { white-space:nowrap; overflow:hidden; text-overflow:ellipsis; max-width:150px; }
.mux .mt.cur.lock { background:#9E8F88; border-color:#9E8F88; color:#fff; }
.mux .mt.cur.lock svg, .mux .mt.cur.lock svg * { color:#fff; }
.mux .mt.lock svg, .mux .mt.lock svg * { color:#C8C8C8; }
.mux .q .qtop { display:flex; align-items:center; gap:6px; min-height:22px; }
.mux .q .qb2 { margin-left:auto; display:flex; gap:4px; flex-wrap:wrap; justify-content:flex-end; }
.mux .q .qb2 span { display:inline-flex; align-items:center; gap:2px; font-size:10.5px; font-weight:700; padding:1px 6px; border-radius:4px; line-height:16px; white-space:nowrap; }
.mux .q .qb2 .ess { border:1px solid #F0B5AE; color:#C62828; }
.mux .q .qb2 .ask { background:#FFF3E0; color:#E65100; }
.mux .q .qb2 .ph { background:#E7F0FC; color:#1E6FD9; }
.mux .q .qb2 .imp { background:#F1EEEC; color:#7F6A60; }
.mux .q .qb2 .lk { background:#F1F1F1; color:#999; }
.mux .q .qb2 .lkv { background:#F1F1F1; color:#999; }
.mux .q .qt2 { margin-top:7px; font-size:14.5px; font-weight:700; color:#222; line-height:1.45; }
.mux .q.lock .qt2 { color:#999; }
.mux .q .qc2 { margin-top:6px; font-size:12.5px; color:#555; line-height:1.6; }
.mux .q .qi2 { margin-top:8px; display:flex; gap:6px; }
.mux .q .qi2 span { width:64px; height:64px; border-radius:8px; background:#F1ECEA; border:1px solid #E5DFDC; }
.mux .q .opi { display:flex; gap:6px; }
.mux .q .opi .op { flex:1; margin-top:0 !important; padding:9px 8px; justify-content:center; font-size:13px; }
.mux .q.lock .ta { background:#F7F6F5; border-color:#EEE; color:#BBB; }
.mux .q.lock .att .add { opacity:.55; }
.mux .q.lock .sl { color:#C8C8C8; }
.mux .q .lkl2 { display:flex; justify-content:space-between; font-size:10.5px; color:#999; margin-top:5px; }
.mux .aichip { display:inline-flex; align-items:center; gap:4px; font-size:11.5px; font-weight:700; color:#6A4FC9; background:#F1ECFF; border-radius:12px; padding:3px 10px; }
.mux .ainote { margin-top:8px; background:#F7F4FF; border:1px solid #E2D9FB; border-radius:10px; padding:9px 12px; font-size:12px; color:#4A3B8C; line-height:1.55; }
.mux .aifab { display:flex; justify-content:flex-end; margin-top:12px; }
.mux .aifab span { width:54px; height:54px; border-radius:50%; background:#6A4FC9; color:#fff; display:flex; flex-direction:column; align-items:center; justify-content:center; box-shadow:0 4px 12px rgba(106,79,201,.35); font-weight:800; font-size:15px; line-height:1.05; }
.mux .aifab span small { font-size:9.5px; font-weight:600; color:#E9E3FF; }
.mux .ok2 { margin-top:8px; display:flex; gap:7px; align-items:center; background:#EEF7EF; border:1px solid #CFE6D1; border-radius:10px; padding:9px 12px; font-size:12px; color:#2E6B33; }
.mux .lockbar .go2 { flex-shrink:0; align-self:center; height:32px; padding:0 11px; border-radius:7px; background:#715D54; color:#fff; font-size:12px; font-weight:700; display:inline-flex; align-items:center; }
/* 아래에서 올라오는 창은 하단 탭 위로 */
.mux-sheet-dim { z-index:1000; }
.mux-sheet { z-index:1001; max-height:86vh; overflow:auto; padding-bottom:calc(16px + env(safe-area-inset-bottom)); }
/* 가로로 밀어 보는 필터 줄: 오른쪽 끝을 흐리게(더 있음 표시) */
.mux .fcard .r2s { -webkit-mask-image:linear-gradient(90deg,#000 86%,transparent); mask-image:linear-gradient(90deg,#000 86%,transparent); padding-right:28px; }

/* =====================================================================
   10-22 구현 — 실제 화면에서 필요한 보강(예시에 없던 상태·입력 부품)
   ===================================================================== */
/* 목록 카드 펼치기(data-tgl) */
.mux .lc[data-tgl] { cursor:pointer; -webkit-tap-highlight-color:transparent; }
.mux .lc .xpd { display:none; cursor:default; }
.mux .lc.open .xpd { display:block; }
.mux .lc .tgl::after { content:'▼'; }
.mux .lc.open .tgl::after { content:'▲'; }
.mux .lc.prep { border-style:dashed; }
.mux .lc .st .big small { color:inherit; }
.mux .moi-refund { background:#FFF8E1; color:#B06000; }
.mux .moi-mixed { background:#EFEFEF; color:#666; }
.mux .bd svg { width:11px; height:11px; }
.mux .near .tgs { display:flex; gap:3px; flex-wrap:wrap; }
.mux .near .tgs .tg { padding:1px 6px; font-size:10.5px; }
.mux .cond .ng { color:#E65100; font-weight:700; font-size:11px; }
.mux .cond .na { color:#C8BEB9; font-size:11px; }
.mux .xt { font-size:12.5px; color:#444; line-height:1.6; }
.mux .xc .t-sub { line-height:1.5; }
/* 필터 카드 — 실제 입력(토글 체크박스 · 흐린 정렬 · 위치 안내) */
.mux .ftog input { position:absolute; opacity:0; width:0; height:0; pointer-events:none; }
.mux .seg a.dis { color:#CCC; }
.mux .fcard .nt { display:flex; align-items:center; gap:8px; }
.mux .fcard .nt > span { flex:1; min-width:0; color:inherit; }
.mux .home.none { background:#FDF3E7; color:#B06000; }
.mux .locw { display:flex; gap:7px; align-items:flex-start; margin-top:8px; background:#FFF8E1; border:1px solid #F1E3C4; border-radius:10px; padding:9px 12px; font-size:12px; color:#7A5B12; line-height:1.55; }
.mux .locw > span { flex:1; color:inherit; }
.mux .locw b { color:#5B4A3F; }
.mux .locw .ul { flex-shrink:0; color:#715D54; text-decoration:underline; }
.mux .fapplied { display:flex; align-items:center; gap:6px; flex-wrap:wrap; margin-top:8px; font-size:12px; }
.mux .fapplied .ul { margin-left:auto; color:#715D54; text-decoration:underline; font-size:12px; }
/* 빈 화면 */
.mux .empty { margin-top:12px; background:#fff; border:1px solid #ECE6E3; border-radius:12px; padding:28px 16px 24px; text-align:center; }
.mux .empty .ic { width:44px; height:44px; border-radius:50%; background:#F7F3F1; color:#8C7469; display:inline-flex; align-items:center; justify-content:center; }
.mux .empty .t { margin-top:10px; font-size:14.5px; font-weight:700; color:#333; }
.mux .empty .s { margin-top:4px; font-size:12px; color:#999; line-height:1.5; }
.mux .empty .lk { display:inline-flex; align-items:center; gap:4px; margin-top:12px; font-size:12.5px; font-weight:700; color:#715D54; }
/* 더 불러오기 표시 */
.mux .mux-more { display:none; padding:18px 0 6px; text-align:center; }
.mux .mux-more span { display:inline-block; width:7px; height:7px; margin:0 3px; border-radius:50%; background:#C8B8B0; animation:muxdot 1.2s infinite ease-in-out; }
.mux .mux-more span:nth-child(2) { animation-delay:.2s; }
.mux .mux-more span:nth-child(3) { animation-delay:.4s; }
@keyframes muxdot { 0%, 80%, 100% { transform:scale(.7); opacity:.4; } 40% { transform:scale(1); opacity:1; } }

/* ── 화면 위에 뜨는 창(.mux-lm): 현재 위치 동의(아래에서 올라옴) · 위치 보정(전체 화면) · 찾는 중 ── */
.mux-lm { position:fixed; top:0; right:0; bottom:0; left:0; z-index:1000; background:rgba(0,0,0,.4); display:none; }
.mux-lm, .mux-lm * { box-sizing:border-box; }
.mux-lm.sheet { align-items:flex-end; justify-content:center; }
.mux-lm .t-sub { font-size:12px; color:#999; }
.mux-lm .t-mute { font-size:11.5px; color:#AAA; }
.mux-lm .btn { display:flex; align-items:center; justify-content:center; gap:4px; height:46px; border-radius:10px; font-size:15px; font-weight:700; background:#715D54; color:#fff; border:0; width:100%; cursor:pointer; }
.mux-lm .btn.line { background:#fff; color:#715D54; border:1px solid #CDBFB9; }
.mux-lm .btn:disabled { background:#E3DCD8; color:#A99C96; }
.mux-lm .lmh { display:flex; gap:10px; align-items:flex-start; }
.mux-lm .lmh .ic { width:34px; height:34px; border-radius:10px; background:#E8F5E9; color:#2E7D32; display:inline-flex; align-items:center; justify-content:center; flex-shrink:0; }
.mux-lm .lmh h4 { margin-bottom:2px; }
.mux-lm .lml { margin-top:12px; display:flex; flex-direction:column; gap:8px; font-size:12.5px; color:#444; line-height:1.55; }
.mux-lm .lml > div { display:flex; gap:8px; color:#444; }
.mux-lm .lml > div > div { color:#444; }
.mux-lm .lml > div > b { color:#715D54; flex-shrink:0; }
.mux-lm .lml > div > div b { color:#3E322C; }
.mux-lm .lmn { margin-top:10px; }
.mux-lm .lmb { display:flex; gap:8px; margin-top:12px; flex-shrink:0; }
.mux-lm .lmb .btn.line { flex:0 0 96px; }
.mux-lm .lmb .btn:not(.line) { flex:1; }
.mux-lm.full { background:#fff; }
.mux-lm .fxw { flex:1; display:flex; flex-direction:column; min-height:0; padding:0 16px calc(12px + env(safe-area-inset-bottom)); }
.mux-lm .fxh { display:flex; align-items:center; gap:8px; height:52px; flex-shrink:0; }
.mux-lm .fxh b { font-size:16px; color:#222; }
.mux-lm .fxh .x { width:36px; height:36px; border:0; background:none; display:inline-flex; align-items:center; justify-content:center; color:#555; margin-left:-8px; }
.mux-lm .s { font-size:12px; color:#888; line-height:1.5; flex-shrink:0; }
.mux-lm .s.warn { color:#B06000; }
.mux-lm .fxs { display:flex; align-items:center; gap:6px; margin-top:8px; height:42px; padding:0 4px 0 12px; background:#F7F4F2; border-radius:10px; flex-shrink:0; color:#A89890; }
.mux-lm .fxs input { flex:1; min-width:0; border:0; background:none; font-size:16px; color:#333; height:40px; outline:none; }
.mux-lm .fxs button { height:34px; padding:0 12px; border:0; border-radius:8px; background:#715D54; color:#fff; font-size:13px; font-weight:700; }
.mux-lm .fxr { font-size:11.5px; color:#999; margin-top:6px; flex-shrink:0; }
.mux-lm .fx-list { max-height:26vh; overflow:auto; flex-shrink:0; }
.mux-lm .fx-item { padding:9px 4px; border-bottom:1px solid #F1ECEA; }
.mux-lm .fx-item .a { font-size:13.5px; font-weight:700; color:#222; }
.mux-lm .fx-item .b { font-size:11.5px; color:#999; }
.mux-lm .fx-item.on .a { color:#715D54; }
.mux-lm .fx-map { position:relative; flex:1; min-height:200px; margin-top:8px; border-radius:12px; overflow:hidden; border:1px solid #E5DFDC; background:#EEE; }
.mux-lm .fx-mapbox { position:absolute; top:0; right:0; bottom:0; left:0; }
.mux-lm .fx-top { position:absolute; left:8px; right:8px; top:8px; z-index:3; background:rgba(255,255,255,.95); border-radius:8px; padding:6px 10px; font-size:12px; color:#555; text-align:center; pointer-events:none; }
.mux-lm .fx-top b { color:#3E322C; }
.mux-lm .fx-pin { position:absolute; left:50%; top:50%; z-index:3; transform:translate(-50%, -100%); pointer-events:none; display:flex; flex-direction:column; align-items:center; }
.mux-lm .fx-pin span { background:#3E322C; color:#fff; font-size:11px; font-weight:700; border-radius:6px; padding:2px 7px; }
.mux-lm .fx-pin i { width:2px; height:14px; background:#3E322C; }
.mux-lm .fx-pin em { width:8px; height:8px; border-radius:50%; background:#3E322C; margin-top:-2px; }
.mux-lm .fx-err { position:absolute; top:0; right:0; bottom:0; left:0; z-index:4; align-items:center; justify-content:center; padding:20px; text-align:center; background:#F7F4F2; font-size:12.5px; color:#B06000; }
.mux-lm .fx-cur { margin-top:8px; font-size:12px; color:#666; line-height:1.55; flex-shrink:0; }
.mux-lm .fx-cur b { color:#3E322C; }
.mux-lm .fx-cur a { color:#715D54; text-decoration:underline; }
.mux-lm.busy { align-items:center; justify-content:center; background:rgba(0,0,0,.3); }
.mux-lm.busy span { background:#fff; padding:14px 18px; border-radius:12px; font-size:13.5px; font-weight:700; color:#3E322C; box-shadow:0 6px 18px rgba(0,0,0,.18); }
/* 카드 제목 줄: 이름(여러 줄) + 오른쪽 펼침 표시(▼/▲)가 따로 떨어지지 않게 */
.mux .lc[data-tgl] .nm { display:flex; align-items:flex-start; gap:6px; }
.mux .lc[data-tgl] .nm .t { flex:1; min-width:0; color:inherit; }
.mux .lc[data-tgl] .nm .t .br { color:#999; font-weight:600; font-size:12.5px; margin-right:4px; }
.mux .lc .tgl { flex-shrink:0; margin:5px 0 0; vertical-align:baseline; }
/* 모집완료·준비중 카드의 막대는 흐리게 */
.mux .lc.dim .bar i, .mux .lc.prep .bar i { background:#CFC6C2; }
/* ── 진단 대상 매장 ── */
.mux .steps .stp { cursor:default; }
.mux .pctx .bds .pmore { margin-left:auto; display:inline-flex; align-items:center; gap:3px; font-size:12px; font-weight:700; color:#5B4A3F; }
.mux .pctx .pmore .tgl::after { content:'▾'; font-size:11px; color:#8C7469; }
.mux .pctx.open .pmore .tgl::after { content:'▴'; }
.mux .pctx .pxp { display:none; padding:10px 12px 12px; background:#FBF9F8; border-top:1px solid #F1ECEA; }
.mux .pctx.open .pxp { display:block; }
.mux .ctx .sub .warn { color:#B06000; }
.mux .st3 .v.sm { font-size:13px; margin-top:5px; white-space:normal; line-height:1.3; }
.mux .fsrch input { flex:1; min-width:0; height:36px; border:0; background:none; padding:0; font-size:16px; color:#333; outline:none; -webkit-appearance:none; appearance:none; }
.mux .fsrch input::placeholder { color:#B5AAA5; font-size:13px; }
.mux .fsrch input::-webkit-search-cancel-button { -webkit-appearance:none; }
.mux .fdd { position:relative; }
.mux .fdd select { position:absolute; top:0; left:0; width:100%; height:100%; opacity:0; font-size:16px; -webkit-appearance:none; appearance:none; cursor:pointer; }
.mux .lc .pk { margin-left:auto; width:22px; height:22px; border-radius:6px; border:1.5px solid #CFC6C2; background:#fff; display:inline-flex; align-items:center; justify-content:center; color:#fff; font-size:13px; box-sizing:border-box; }
.mux .lc.pick .pk { background:#715D54; border-color:#715D54; }
.mux .lc.pick .pk::after { content:'✓'; color:#fff; }
.mux .lc .pick-cb { position:absolute; opacity:0; width:0; height:0; pointer-events:none; }
.mux .lc.sc.can { cursor:pointer; -webkit-tap-highlight-color:transparent; }
.mux .lc.sc.can .tgl { padding:2px 4px; margin:3px -4px 0 0; cursor:pointer; }
.mux .lc .st.c2 { grid-template-columns:0.8fr 1.6fr; }
.mux .lc .st .wkw { margin-top:4px; }
.mux .lc .st .tm { font-size:12.5px; color:#555; }
.mux .lc .st .tm.none { color:#BBB; }
.mux .lc .st .wkw + .sm { margin-top:3px; }
.mux .xaddr { font-size:14px; font-weight:700; color:#222; line-height:1.45; }
.mux .xc .xaddr + .t-sub { margin-top:2px; }
.mux .mapbtn { cursor:pointer; }
/* 지역 고르기 창 */
.mux-lm .mux-sheet h4 { display:flex; align-items:baseline; gap:6px; }
.mux-lm .lchk { display:grid; grid-template-columns:1fr 1fr; gap:6px; max-height:50vh; overflow:auto; }
.mux-lm .lchk label { display:flex; align-items:center; gap:7px; min-height:42px; padding:8px 10px; border:1px solid #E5DFDC; border-radius:10px; font-size:13.5px; color:#333; background:#fff; }
.mux-lm .lchk label span { flex:1; color:inherit; }
.mux-lm .lchk label small { font-size:11px; color:#AAA; }
.mux-lm .lchk label.off { opacity:.45; }
.mux-lm .lchk input { width:18px; height:18px; accent-color:#715D54; flex-shrink:0; }
.mux-lm .lchk label:has(input:checked) { border-color:#715D54; background:#F7F3F1; font-weight:700; }
/* 하단 막대 안 숫자(body *{color} 덮어쓰기) — 고른 매장 수 */
.mux-bar .tx b span { color:inherit; }
.mux-bar .tx small { color:#CDBFB9; }
.mux-bar .tx b { color:#fff; }
.mux-bar a.b1 { color:#E9DED9; }
.mux-bar a.b3 { color:#3E322C; }
/* ── 진행중 진단 리스트 ── */
.mux .vsw .seg a { color:#888; }
.mux .vsw .seg a.on { color:#fff; }
.mux .opipe a { display:block; text-decoration:none; }
.mux .opipe a .nm, .mux .opipe a .cap { display:block; }
.mux .lc .st.c2b { grid-template-columns:0.85fr 1.5fr; }
.mux .lc .prog { margin-top:9px; }
.mux .lc .prog .bar { flex:1; }
.mux .lc.og .an { color:#888; }
.mux .lc.og .an.red { color:#C62828; }
.mux .xc.tlw { padding:10px 6px 8px; }
.mux .tl .s.cur i { background:#715D54; box-shadow:0 0 0 3px #EBE7E6; }
.mux .tl .s.cur .l { color:#3E322C; font-weight:700; }
.mux .tl .s.cur .d { color:#715D54; }
.mux .tl .s .d { white-space:normal; word-break:keep-all; line-height:1.25; padding:0 2px; }
.mux .xfoot .btn.sm { width:auto; padding:0 12px; }
.mux .empty.sm { padding:16px; }
.mux .empty.sm .lk { margin-top:6px; }
.mux .slim .bd { flex-shrink:0; }
/* 일정 보기 — 달력(날짜를 누르면 그날 일정) · 내 매장 지도 줄 · 다가오는 일정 · 확인이 필요한 일정 */
.mux .card.calc { padding:10px 10px 10px; }
.mux .calnav .ar { width:28px; height:28px; border-radius:50%; border:1px solid #E5DFDC; background:#fff; display:inline-flex; align-items:center; justify-content:center; color:#8C7469; font-size:14px; }
.mux .calnav .today { margin-left:auto; }
.mux .calsum { margin:0 2px 6px; }
.mux .calsum .red { color:#C62828; font-weight:700; }
.mux .ocal { margin-top:0; }
.mux .ocal .gd > span, .mux .ocal .gd > a { height:44px; display:flex; flex-direction:column; align-items:center; justify-content:center; padding:0 0 6px; font-size:13.5px; color:#333; border-top:1px solid #F6F3F2; position:relative; box-sizing:border-box; background:none; }
.mux .ocal .gd > .e { border-top-color:transparent; }
.mux .ocal .gd > span::after { content:none; }
.mux .ocal .gd > .x { color:#C9C1BD; }
.mux .ocal .gd > .today { font-weight:700; color:#715D54; }
.mux .ocal .gd > .end { color:#C62828; font-weight:700; }
.mux .ocal .gd > .has { cursor:pointer; }
.mux .ocal .gd > .sel { background:#F7F3F1; border-radius:8px; }
.mux .ocal .gd small { font-size:8.5px; line-height:1; margin-top:1px; color:inherit; }
.mux .ocal .gd .evs { position:absolute; left:4px; right:4px; bottom:4px; display:flex; flex-direction:column; gap:1px; font-style:normal; }
.mux .ocal .gd .evs i { display:block; height:3px; border-radius:2px; }
.mux .evs .plan, .mux .calleg .plan { background:#fff; border:1px dashed #B9A49A; height:2px !important; }
.mux .evs .late, .mux .calleg .late { background:#F3B7B0; }
.mux .evs .done, .mux .calleg .done { background:#A5D6A7; }
.mux .evs .start, .mux .calleg .start { background:#D7CCC8; }
.mux .evs .end, .mux .calleg .end { background:#EF9A9A; }
.mux .calleg { display:flex; gap:10px; flex-wrap:wrap; margin-top:8px; font-size:10.5px; color:#888; }
.mux .calleg span { display:inline-flex; align-items:center; gap:4px; color:inherit; }
.mux .calleg i { display:inline-block; width:12px; height:5px; border-radius:2px; }
.mux .calday { margin-top:8px; border-top:1px solid #F1ECEA; padding-top:8px; }
.mux .calday .cdh { font-size:12.5px; font-weight:700; color:#3E322C; margin:0 2px 6px; }
.mux .calday .dl { display:flex; align-items:center; gap:6px; padding:7px 4px; font-size:13px; color:#333; border-bottom:1px solid #F6F3F2; }
.mux .calday .dl:last-child { border-bottom:0; }
.mux .card.maprow { display:flex; align-items:center; gap:8px; padding:11px 12px; margin-top:10px; }
.mux .card.maprow b { font-size:14px; color:#222; }
.mux .card.maprow b.n { color:#715D54; }
.mux .card.maprow .t-mute { flex:1; min-width:0; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.mux .todo .r .t1 .bd { flex-shrink:0; }
.mux .todo .r .t1 { flex-wrap:wrap; }
.mux .sec-h h3 .red { color:#E53935; }
/* ── 진단 완료 리스트 ── */
.mux .sum1 .v { color:#3E322C; }
.mux .lc .st.cp3 .big { font-size:16px; }
.mux .lc .st .sm .grn { color:#2E7D32; }
.mux .lc .st .sm .wait { color:#B06000; }
.mux .rcpt span { color:#333; }
.mux .rcpt .k { color:#666; }
.mux .rcpt .z { color:#C8BEB9; }
.mux .rcpt > span:nth-child(even) { text-align:right; }
.mux .rcpt .tot .tg { margin-left:4px; }
.mux .rwl { display:flex; align-items:center; gap:8px; }
.mux .rbig.mute { color:#C8BEB9; font-size:17px; }
.mux .kv2.rwc { margin-top:8px; border-top:1px dashed #EFE9E6; padding-top:8px; }
.mux .info2 > div { color:inherit; }
.mux .info2 svg { flex-shrink:0; margin-top:2px; }
.mux .useg a { display:block; }
.mux .lc .st.cp3 .sm { white-space:normal; line-height:1.35; }
/* ── 신청 정보 입력 · 신청 전 확인사항(서약) ── */
.mux .st3.one { grid-template-columns:1fr; }
.mux .st3 .v small { font-size:11px; color:#999; font-weight:500; }
.mux .ctx .note svg { flex-shrink:0; margin-top:2px; color:#A07A2A; }
.mux .note > div { color:inherit; }
.mux .q .op input { position:absolute; opacity:0; width:0; height:0; pointer-events:none; }
.mux .q .op { cursor:pointer; -webkit-tap-highlight-color:transparent; }
.mux .q .ops { margin-top:10px; }
.mux .q.pl .ops { margin-left:32px; }
.mux .q.pl .qc { color:#555; }
.mux .q .qc.clamp { display:-webkit-box; -webkit-line-clamp:3; -webkit-box-orient:vertical; overflow:hidden; }
.mux .q .qmore { display:inline-block; margin:4px 0 0 32px; font-size:12px; color:#715D54; text-decoration:underline; }
.mux .q .tk { font-size:10px; padding:0 6px; vertical-align:2px; }
.mux .q.ok { border-color:#C9E3CB; }
.mux .q.ok .qn { background:#43A047; }
.mux .q .op.no.on { border-color:#E57373; background:#FFF6F5; color:#C62828; }
.mux .q .op.no.on i { border-color:#E53935; background:#E53935; box-shadow:inset 0 0 0 3px #FFF6F5; }
.mux .q .pwarn { display:none; margin:8px 0 0 32px; font-size:12px; color:#C62828; }
.mux .q.ng .pwarn { display:block; }
.mux .mux-bar.flow .btn:disabled, .mux .mux-bar.flow .btn[disabled] { background:#E3DCD8; color:#A99C96; }
.mux button.btn { border:0; cursor:pointer; }
.mux .q.ifq .qt3 { font-size:14.5px; font-weight:700; color:#222; }
.mux .q.ifq .qc2 b { color:#715D54; }
.mux .chips { display:flex; flex-wrap:wrap; gap:6px; margin-top:10px; }
.mux .chips .chip { display:inline-flex; align-items:center; height:36px; padding:0 13px; border:1px solid #E5DFDC; border-radius:18px; font-size:13.5px; color:#555; background:#fff; cursor:pointer; }
.mux .chips .chip input { position:absolute; opacity:0; width:0; height:0; pointer-events:none; }
.mux .chips .chip.on { border-color:#715D54; background:#F7F3F1; color:#715D54; font-weight:700; }
/* ── 교육(자료 보기 · 퀴즈 · 결과) ── */
.mux .card.tctx { padding:11px 13px; }
.mux .card.tctx .bds { display:flex; gap:6px; align-items:center; flex-wrap:wrap; }
.mux .card.tctx .bds b { font-size:14.5px; color:#222; }
.mux .card.tctx .bds .br { color:#999; font-weight:600; font-size:12.5px; margin-right:4px; }
.mux .card.tctx .t-sub { margin-top:3px; }
.mux .note > svg { flex-shrink:0; margin-top:3px; color:#A07A2A; }
.mux .tv .tvh { display:flex; align-items:baseline; gap:8px; margin:0 2px 8px; }
.mux .tv .tvh b { font-size:14px; color:#222; }
.mux .tv .tvh .t-mute { flex:1; min-width:0; font-size:11px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.mux .tv .tvh .cnt { font-size:12px; color:#999; }
.mux .tv .tvh .cnt b { font-size:12px; color:#715D54; }
.mux .tv .tvs { display:flex; overflow-x:auto; scroll-snap-type:x mandatory; -webkit-overflow-scrolling:touch; scrollbar-width:none; border-radius:10px; background:#F7F4F2; }
.mux .tv .tvs::-webkit-scrollbar { display:none; }
.mux .tv .tvi { flex:0 0 100%; scroll-snap-align:start; display:flex; align-items:center; justify-content:center; min-height:200px; }
.mux .tv .tvi a { display:block; width:100%; }
.mux .tv .tvi img { display:block; width:100%; height:auto; }
.mux .tv .tvn { display:flex; align-items:center; justify-content:space-between; gap:8px; margin-top:8px; }
.mux .tv .tvn .ar { width:34px; height:34px; border-radius:50%; border:1px solid #E5DFDC; background:#fff; color:#8C7469; display:inline-flex; align-items:center; justify-content:center; }
.mux .tv .tvn .ar:disabled { opacity:.35; }
.mux .tv .dots { display:flex; gap:5px; flex-wrap:wrap; justify-content:center; }
.mux .tv .dots i { width:6px; height:6px; border-radius:50%; background:#E0D7D3; }
.mux .tv .dots i.on { width:16px; border-radius:3px; background:#715D54; }
.mux .tv .prog { margin-top:8px; }
.mux .card.qzh { display:flex; align-items:center; gap:10px; }
.mux .card.qzh .tx { flex:1; min-width:0; }
.mux .card.qzh .tx b { font-size:14px; color:#222; }
.mux .card.qzh .btn.sm { width:auto; padding:0 12px; flex-shrink:0; }
.mux .q.qz .qn { min-width:28px; }
.mux .q.qz .qc0 { margin-top:8px; font-size:12.5px; color:#555; line-height:1.6; }
.mux .q.qz .qimg { display:flex; gap:6px; flex-wrap:wrap; margin-top:8px; }
.mux .q.qz .qimg img { width:72px; height:72px; object-fit:cover; border-radius:8px; border:1px solid #E5DFDC; }
.mux .q.qz .op .on2 { color:#AAA; font-size:12px; width:12px; flex-shrink:0; }
.mux .q.qz .op.on .on2 { color:#715D54; }
.mux .q.qz .op .tx2 { flex:1; min-width:0; color:inherit; line-height:1.45; }
.mux .q.qz .qerr { display:none; margin-top:6px; font-size:12px; color:#C62828; }
.mux .q.qz.err { border-color:#F3C9C4; }
.mux .q.qz.err .qerr { display:block; }
.mux .q.qz.done .qn { background:#8C7469; }
.mux .t-mute.red { color:#C62828; }
.mux .card.rs { margin-top:10px; padding:22px 16px 18px; text-align:center; }
.mux .card.rs .rs-ic { width:52px; height:52px; border-radius:50%; margin:0 auto; display:flex; align-items:center; justify-content:center; font-size:24px; font-weight:800; color:#fff; }
.mux .card.rs.ok .rs-ic { background:#43A047; }
.mux .card.rs.ng .rs-ic { background:#E65100; }
.mux .card.rs h3 { margin-top:12px; font-size:17px; font-weight:700; color:#222; }
.mux .card.rs h3 b { color:#C62828; }
.mux .card.rs .t-sub { margin-top:6px; line-height:1.55; font-size:12.5px; }
.mux .rsl { margin-top:14px; text-align:left; border-top:1px solid #F1ECEA; }
.mux .rsl .li { display:flex; align-items:center; gap:7px; padding:9px 2px; border-bottom:1px solid #F6F3F2; font-size:12.5px; color:#444; }
.mux .rsl .li .m { width:20px; height:20px; border-radius:50%; background:#E8F5E9; color:#2E7D32; font-size:11px; font-weight:800; display:inline-flex; align-items:center; justify-content:center; flex-shrink:0; }
.mux .rsl .li.x .m { background:#FDECEA; color:#C62828; }
.mux .rsl .li .q { font-weight:700; color:#715D54; flex-shrink:0; }
.mux .rsl .li .qt { flex:1; min-width:0; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; color:inherit; }
.mux .rsl .li .tip { font-size:11px; color:#C62828; flex-shrink:0; }
.mux .mux-bar .lk2 { display:block; text-align:center; margin-top:10px; font-size:12.5px; color:#715D54; text-decoration:underline; }
/* ── 진단 입력(일정등록 · 방문인증 · 결과입력 · 영수증 등록) 공통 ── */
.mux .ctx .hint { color:#999; }
.mux .ctx .hint.red { color:#C62828; }
.mux .st3 .v small { color:inherit; }
.mux .st3 .v.sm { font-size:13px; margin-top:5px; }
.mux .stp b { color:inherit; }
.mux .stp.edu svg { color:#8C7469; }
.mux .motp .hd .fold { margin-left:auto; color:#8C7469; font-size:11.5px; flex-shrink:0; }
.mux .motp .hd > span { min-width:0; color:#999; }
.mux .motp .hd .red { color:#C62828; }
.mux .motp .essd, .mux .essd { display:inline-block; width:6px; height:6px; border-radius:50%; background:#F0A040; margin:0 3px 1px 0; }
.mux .motp.folded .wrap { flex-wrap:nowrap; overflow-x:auto; scrollbar-width:none; margin:0 -10px; padding:0 10px 2px; }
.mux .motp.folded .wrap::-webkit-scrollbar { display:none; }
.mux .motp .mt { flex-shrink:0; }
.mux .motp .mt .nm { color:inherit; }
.mux .mt.fix b { color:#fff; }
.mux .mt.cur.fix b { color:#C62828; }
.mux .aimode { display:flex; align-items:center; gap:8px; margin-bottom:8px; }
.mux .aimode .t-mute { font-size:11px; }
.mux .mh .sv { margin-left:auto; }
.mux .mh .red { color:#C62828; }
.mux .lockbar svg { color:#E65100; flex-shrink:0; margin-top:2px; }
.mux .lockbar > div { color:inherit; }
.mux .ok2 svg { color:#2E7D32; flex-shrink:0; }
.mux .ok2 span { color:inherit; }
.mux .guide { color:#5B4A3F; }
.mux .guide .qi { margin-top:8px; flex-wrap:wrap; }
.mux .guide .qi img { width:56px; height:56px; object-fit:cover; border-radius:8px; border:1px solid #E8DCC2; display:block; }
.mux button.btn { border:0; cursor:pointer; font-family:inherit; }
.mux .btn:disabled { background:#E3DCD8; color:#A99C96; cursor:default; }
.mux-bar button { flex-shrink:0; height:38px; padding:0 14px; border-radius:9px; display:inline-flex; align-items:center; font-size:13.5px; font-weight:700; border:0; cursor:pointer; font-family:inherit; }
.mux-bar button.b2 { background:#5F4D45; color:#fff; }
.mux-bar button.b2:disabled { background:#4E4039; color:#9C8B83; cursor:not-allowed; }

/* 결과입력 — 문항 카드(입력 이름·id·label 순서는 저장·사진·AI 추천 스크립트가 쓰는 그대로) */
.mux .qlist { display:flex; flex-direction:column; row-gap:10px; padding:0; margin:0; list-style:none; }
.mux .qlist > .q { list-style:none; background:#fff; border:1px solid #ECE6E3; border-radius:12px; padding:14px 13px 13px; margin:0; }
.mux .qlist > .q + .q { margin-top:0; }
.mux .q.fix { border-color:#F3C9C4; }
.mux .q.fix .qn { background:#FDECEA; color:#C62828; }
.mux .q .qt2 img, .mux .q .qc2 img { max-width:100%; height:auto; }
.mux .q .qi2 { flex-wrap:wrap; }
.mux .q .qi2 a { display:block; }
.mux .q .qi2 img { width:64px; height:64px; object-fit:cover; border-radius:8px; border:1px solid #E5DFDC; display:block; }
.mux .q .opw { display:flex; flex-direction:column; gap:6px; }
/* 숨긴 진짜 단추는 화면에 고정(fixed). absolute(위치 미지정)면 보기 묶음 맨 위에 모여, 아래 보기를 누를 때 포커스가 그리로 가며
   크롬 엔진(안드로이드 앱 웹뷰·크롬)이 화면을 그 자리로 끌어 올렸다(2026-10-23 실측 -679px). fixed 면 늘 화면 안이라 움직이지 않는다.
   top:0 이 아니라 30% — 앱 웹뷰는 스크롤 뒤 보이는 영역이 8px 어긋나 맨 위(0)가 살짝 화면 밖이 되어, 누를 때마다 8px 당겼다(실기기 S25 확인).
   화면 안쪽이면 키보드가 올라와 있어도 보이는 영역 안이다. */
.mux .q .opw > input { position:fixed; top:30%; left:0; opacity:0; width:0; height:0; pointer-events:none; }
.mux .q .opw > label.op { display:flex; align-items:center; gap:9px; min-height:42px; margin:0; padding:9px 12px; border:1px solid #E5DFDC; border-radius:10px; font-size:13.5px; color:#333; background:#fff; position:relative; cursor:pointer; -webkit-tap-highlight-color:transparent; line-height:1.45; }
.mux .q .opw > label.op::before { content:none; }
.mux .q .opw > label.op .ot { flex:1; min-width:0; color:inherit; }
.mux .q .opw > label.op i { flex-shrink:0; width:18px; height:18px; border:1.5px solid #CFC6C2; border-radius:50%; box-sizing:border-box; background:#fff; }
.mux .q .opw.cb > label.op i { border-radius:5px; }
.mux .q .opw > input:checked + label.op { border-color:#715D54; background:#F7F3F1; font-weight:700; color:#333; }
.mux .q .opw > input:checked + label.op i { border-color:#715D54; background:#715D54; box-shadow:inset 0 0 0 3px #F7F3F1; }
.mux .q .opw.cb > input:checked + label.op i { box-shadow:none; background:#715D54 url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path d='M5 12l5 5L20 7' stroke='white' stroke-width='3' fill='none'/></svg>") center/12px no-repeat; }
.mux .q .opw > input:focus-visible + label.op { outline:2px solid #B9A49A; outline-offset:1px; }
.mux .q .opw.inl { flex-direction:row; }
.mux .q .opw.inl > label.op { flex:1; justify-content:center; padding:9px 8px; font-size:13px; }
.mux .q .opw.inl > label.op .ot { flex:0 1 auto; }
.mux .q .opw.lk { display:grid; grid-template-columns:repeat(var(--n, 5), minmax(0, 1fr)); gap:6px; }
.mux .q .opw.lk > label.op { height:42px; min-height:0; padding:0; justify-content:center; font-size:14px; font-weight:700; color:#666; border-radius:9px; }
.mux .q .opw.lk > input:checked + label.op { background:#715D54; border-color:#715D54; color:#fff; }
.mux .q .sl { color:#AAA; }
.mux .q .tabox { display:block; width:100%; padding:0; margin:0; }
.mux .q .tabox textarea { display:block; width:100%; height:auto; min-height:84px; border:1px solid #E5DFDC; border-radius:10px; padding:10px 12px; font-size:16px; color:#333; background:#fff; line-height:1.55; box-sizing:border-box; resize:vertical; }
.mux .q .tabox.error textarea { border-color:#E57373; }
.mux .q .tabox .textarea-info { display:flex; justify-content:space-between; margin-top:4px; font-size:11px; color:#AAA; }
.mux .q .tabox .textarea-info .msg-box .error { display:none; color:#E53935; font-size:11px; margin:0; }
.mux .q .tabox.error .textarea-info .msg-box .error { display:block; }
.mux .q .tabox .strCont, .mux .q .tabox .strCont span { font-size:11px; color:#AAA; }
.mux .q .tabox.error .strlen { color:#E53935; }
.mux .q .ta-save-status { font-size:11.5px !important; }
.mux .q .att { display:flex; flex-wrap:wrap; align-items:flex-start; gap:6px; margin-top:10px; width:100%; padding:0; }
.mux .q .att form { margin:0; }
.mux .q .att input[type="file"] + label.add { width:64px; height:64px; margin:0; padding:0; border:1.5px dashed #CFC6C2; border-radius:9px; background:#fff; display:flex; flex-direction:column; align-items:center; justify-content:center; font-size:10.5px; font-weight:500; color:#8C7469; gap:1px; }
.mux .q .att input[type="file"] + label.add b { font-size:18px; color:#8C7469; line-height:1; }
.mux .q .att .file-img-list { width:auto; display:flex; flex-direction:row; flex-wrap:wrap; gap:6px; margin:0; row-gap:6px; }
.mux .q .att .file-img-item, .mux .q .att .preview { width:64px; height:64px; position:relative; border-radius:9px; }
.mux .q .att .file-img-item a, .mux .q .att .preview { display:block; overflow:hidden; border-radius:9px; background:#E9E3DF; }
.mux .q .att .file-img-item img, .mux .q .att .preview img { width:64px !important; height:64px; object-fit:cover; display:block; }
.mux .q .att .file-img-item .del-button { width:20px; height:20px; top:-6px; right:-6px; border-radius:50%; background-color:#3E322C; background-size:8px 8px; z-index:2; }
.mux .q .att .upload-wait { width:100%; }
.mux .q.lock { background:#FBFAF9; }
.mux .q.lock .qn { background:#EEE; color:#AAA; }
.mux .q.lock .qt2 { color:#999; }
.mux .q.lock .opw > label.op { background:#F7F6F5; color:#AAA; border-color:#EEE; }
.mux .q.lock .opw > input:checked + label.op { background:#EFEDEC; color:#999; border-color:#E2DEDC; }
.mux .q.lock .opw > input:checked + label.op i { background:#C9BDB7; border-color:#C9BDB7; }
.mux .q.lock .tabox textarea { background:#F7F6F5; border-color:#EEE; color:#999; }
.mux .q.lock .att input[type="file"] + label.add { opacity:.55; }
.mux .q.lock:not(.visit-locked) .opw, .mux .q.lock:not(.visit-locked) .tabox, .mux .q.lock:not(.visit-locked) .att { pointer-events:none; }
.mux .q .qb2 .lk, .mux .q .qb2 .lkv { background:#F1F1F1; color:#999; }
/* AI 추천(결과입력 페이지 안 스타일과 함께) — 보기 카드 오른쪽 위 % 단추 자리 */
.mux .q .opw > label.op.ai-rec-label { display:flex; padding-right:40px !important; }

/* 일정등록 — 정보 카드 · 달력(맨 아래) */
.mux details.card summary { list-style:none; display:flex; align-items:center; gap:6px; font-size:13.5px; font-weight:700; color:#222; cursor:pointer; -webkit-tap-highlight-color:transparent; }
.mux details.card summary::-webkit-details-marker { display:none; }
.mux details.card summary svg { color:#8C7469; }
.mux details.dpro { padding:11px 14px; }
.mux details.dpro summary .r { margin-left:auto; min-width:0; font-size:12px; color:#999; font-weight:500; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.mux .card .ch .ic svg { color:#8C7469; }
.mux .card .ch .r { color:#999; font-weight:500; }
.mux .card .tel { color:#715D54; text-decoration:underline; }
.mux .note.dnote { margin-top:10px; }
.mux .note.dnote svg { flex-shrink:0; margin-top:3px; color:#A07A2A; }
.mux .card.dcal { margin-top:14px; border-color:#CDBFB9; }
.mux .t-sub .brand { color:#715D54; }
.mux .cal .hd button { width:28px; height:28px; border-radius:50%; border:1px solid #E5DFDC; background:#fff; display:inline-flex; align-items:center; justify-content:center; color:#8C7469; font-size:14px; padding:0; }
.mux .cal.off .gd span { pointer-events:none; }
.mux .cal.off { opacity:.65; }
.mux .cal .gd span { cursor:pointer; }
.mux .cal .gd span.e { cursor:default; }
.mux .pickd b.none { color:#C8BEB9; font-weight:500; font-size:13px; }

/* 방문인증 — 지도 · 인증 상태 · 방문 예정 · 매장 정보(접기) */
.mux .vmap { position:relative; margin-top:12px; height:240px; border-radius:12px; overflow:hidden; border:1px solid #E5DFDC; background:#F1EEEC; }
.mux .vmap .mapbox { position:absolute; top:0; right:0; bottom:0; left:0; }
.mux .vmap .ld { height:100%; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:4px; text-align:center; padding:0 20px; }
.mux .vmap .ld b { font-size:13px; color:#555; }
.mux .vmap .ld span { font-size:12px; color:#999; }
.mux .vmap .lochelp { position:absolute; right:8px; bottom:8px; z-index:10; display:inline-flex; align-items:center; gap:4px; background:rgba(255,255,255,.94); border:1px solid #DDD; border-radius:16px; padding:5px 10px; font-size:11px; color:#666; }
.mux .vmap .lg { position:absolute; left:8px; bottom:8px; z-index:10; background:rgba(255,255,255,.92); border-radius:6px; padding:3px 8px; font-size:10.5px; color:#555; display:flex; gap:8px; }
.mux .vmap .lg span { display:inline-flex; align-items:center; color:inherit; }
.mux .vmap .lg i { display:inline-block; width:8px; height:8px; border-radius:50%; margin-right:3px; }
.mux .gdbg { margin-top:6px; padding:7px 10px; font-size:11px; line-height:1.6; color:#555; background:#F6F6F6; border:1px solid #EEE; border-radius:8px; word-break:break-all; }
.mux .card.vs { margin-top:10px; }
.mux .card.vs .vh { display:flex; align-items:center; gap:10px; }
.mux .card.vs .vh b { font-size:14.5px; color:#222; }
.mux .card.vs .vi { width:38px; height:38px; border-radius:50%; background:#FFF3E0; color:#E65100; display:flex; align-items:center; justify-content:center; font-weight:800; flex-shrink:0; }
.mux .card.vs .vi.ok { background:#E8F5E9; color:#2E7D32; }
.mux .kv .v.plan { display:flex; gap:6px; align-items:center; }
.mux .kv .v.plan .schedule-input { flex:1; padding:0; min-width:0; }
.mux .kv .v.plan input { width:100%; height:36px; border:1px solid #E5DFDC; border-radius:8px; padding:0 10px; font-size:16px; color:#333; background:#fff; text-align:center; }
.mux .kv .v.plan input:disabled { background:#F7F6F5; color:#999; }
.mux .kv .v.plan .btn.sm { width:auto; padding:0 12px; flex-shrink:0; }
.mux .kv .v span { color:inherit; }
.mux details.dfold { margin-top:10px; padding:11px 14px; }
.mux details.dfold summary .t { white-space:nowrap; }
.mux details.dfold summary .s { flex:1; min-width:0; font-size:11.5px; color:#999; font-weight:500; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.mux details.dfold summary .o { font-size:12px; color:#999; font-weight:500; white-space:nowrap; }
.mux details.dfold summary .o::before { content:'펼치기 ▾'; }
.mux details.dfold[open] summary .o::before { content:'접기 ▴'; }
.mux details.dfold .dfb { margin-top:10px; }
.mux details.dfold .dfb > .card, .mux details.dfold .dfb > details.card { border-color:#F1ECEA; }
.mux details.dfold .dfb > * + * { margin-top:8px; }

/* 영수증 등록 */
.mux .card.rcard .rch { flex-wrap:wrap; align-items:center; }
.mux .card.rcard .rch .tt { color:#222; }
.mux .card.rcard .rch .tt .t-mute { font-weight:500; margin-left:3px; }
.mux .card.rcard .rch .r { margin-left:auto; }
.mux .card.rcard .rtx { font-size:12.5px; color:#555; line-height:1.6; }
.mux .card.rcard .rmemo { display:block; width:100%; padding:0; margin-top:10px; }
.mux .card.rcard .rmemo textarea { display:block; width:100%; min-height:52px; height:auto; border:1px solid #E5DFDC; border-radius:10px; padding:9px 12px; font-size:16px; color:#333; background:#fff; box-sizing:border-box; }
.mux .card.rcard.lock .rmemo textarea { background:#F7F6F5; color:#999; }
.mux .bill .amt input { flex:1; min-width:0; height:34px; border:0; background:none; padding:0; text-align:right; font-size:16px; font-weight:700; color:#333; outline:none; }
.mux .bill .amt input::placeholder { color:#BBB; }
.mux .bill .amt input[readonly] { color:#999; }
.mux .bill > input[type="file"] { position:absolute; opacity:0; width:0; height:0; pointer-events:none; }
.mux .bill .bimg { position:relative; margin-top:7px; }
.mux .bill .bimg .up { height:66px; border:1.5px dashed #CFC6C2; border-radius:9px; display:flex; flex-direction:column; align-items:center; justify-content:center; font-size:11.5px; color:#8C7469; font-weight:700; cursor:pointer; }
.mux .bill .bimg .up small { font-size:10px; color:#BBB; font-weight:500; }
.mux .bill .bimg .img { display:block; height:66px; border-radius:9px; overflow:hidden; background:#E9E3DF; }
.mux .bill .bimg .img img, .mux .bill .bimg img.preview { width:100%; height:66px; object-fit:cover; display:block; border-radius:9px; }
.mux .bill .bimg .del-button { position:absolute; right:-5px; top:-5px; width:20px; height:20px; border-radius:50%; background:#3E322C; color:#fff; font-size:13px; line-height:20px; text-align:center; border:0; padding:0; z-index:2; }
.mux .card.rcard.lock ~ .bills .bill .bimg .up { opacity:.5; }
.mux .q .lkl span { color:#999; }
.mux .q.lock .tabox.error textarea { border-color:#EEE; }
.mux .q.lock .tabox.error .textarea-info .msg-box .error { display:none; }
.mux .q.lock .tabox.error .strlen { color:#AAA; }
/* 설명·예시 사진 작은 줄(문항 밖 — 영수증 카드 등에서도) */
.mux .qi2 { display:flex; gap:6px; flex-wrap:wrap; }
.mux .qi2 a { display:block; }
.mux .qi2 img { width:64px; height:64px; object-fit:cover; border-radius:8px; border:1px solid #E5DFDC; display:block; }
.mux .card.rcard .rch .bd { flex-shrink:0; }
/* ── 프로젝트 홈 ── */
.mux .sum > a { display:block; background:#fff; border:1px solid #ECE6E3; border-radius:12px; padding:11px 12px 10px; min-width:0; -webkit-tap-highlight-color:transparent; }
.mux .sum > a.hot { border-color:#F3C9C4; }
.mux .sum > a .k, .mux .sum > a .s { color:#999; }
.mux .sum .v.mute { color:#C8BEB9; }
.mux .sum .v small { color:#999; }
.mux .todo .r .t1 .nm { min-width:0; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; color:inherit; }
.mux .todo .r .t2 .red, .mux .todo .r .t2.red { color:#C62828; }
.mux .todo .r .t2 { color:#999; }
.mux .todo a.r { color:inherit; }
.mux .todo .r .amt { flex-shrink:0; text-align:right; }
.mux .todo .r .amt b { display:block; font-size:14px; color:#222; }
.mux .todo .r .amt b.none { font-size:12px; color:#C8BEB9; font-weight:600; }
.mux .todo .r .amt small { display:block; font-size:10.5px; color:#AAA; }
.mux .todo .r .go { white-space:nowrap; }
.mux .slims { margin-top:6px; }
.mux .lc + .slims { margin-top:8px; }
.mux .sec-h .t-mute .brand { color:#715D54; }
.mux .empty.sm { margin-top:0; }
/* 로그인 확인창(아래에서 올라옴) */
.mux-lm .lnp h4 { font-size:15px; }
.mux-lm .lnh { font-size:11px; font-weight:700; color:#AAA; letter-spacing:.3px; margin:12px 0 6px; }
.mux-lm .lnl { list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:6px; }
.mux-lm .lnl li { display:flex; align-items:center; gap:10px; padding:10px 12px; background:#F9F6F4; border-radius:10px; }
.mux-lm .lnl li .tx { flex:1; min-width:0; }
.mux-lm .lnl li b { display:block; font-size:13px; color:#333; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.mux-lm .lnl li .tx > span { display:block; font-size:11px; color:#999; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; margin-top:2px; }
.mux-lm .lnl li > a { flex-shrink:0; font-size:12px; font-weight:700; color:#715D54; white-space:nowrap; }
.mux-lm .lnl li > a .fx { font-size:10px; color:#DE5757; font-weight:500; margin-left:2px; }
.mux-lm .lnl .prog { display:flex; align-items:center; gap:8px; margin-top:6px; font-size:11px; color:#666; }
.mux-lm .lnl .prog .bar { flex:1; height:5px; border-radius:3px; background:#E7E1DE; overflow:hidden; }
.mux-lm .lnl .prog .bar i { display:block; height:100%; background:#7F6A60; }
.mux-lm .lnl .prog .bar.red i { background:#DE5757; }
.mux-lm .lnl .prog .bar.grn i { background:#3B6D11; }
.mux-lm .lnl .prog span { color:inherit; }
.mux-lm .lno { display:flex; align-items:center; justify-content:space-between; margin-top:12px; padding:12px 14px; background:#F4F0EE; border:1px solid #E5DED9; border-radius:10px; font-size:13px; color:#555; }
.mux-lm .lno span { color:inherit; }
.mux-lm .lno b { color:#715D54; }
.mux-lm .lno .go { font-size:12px; font-weight:700; color:#715D54; white-space:nowrap; }
.mux-lm .lnp .lmb .btn { flex:1; }
/* 영수증 칸이 잠겼을 때(수정 요청 없음) 첨부 칸은 눌리지 않게 */
.mux .bill .bimg .up.off { opacity:.5; pointer-events:none; cursor:default; }
/* ── 검수 보완(10-22) ── */
/* iOS 는 document 에만 듣는 빈 div 의 누름을 click 으로 보내지 않음 — 어두운 바탕을 눌러 닫히게 */
.mux-lm[data-dim-close] { cursor:pointer; }
.mux-lm[data-dim-close] .mux-sheet { cursor:auto; }
/* 지역 칸 고른 표시 — :has() 를 모르는 구형 브라우저용(ms_ux_m.js MUX.syncChk 가 .on 을 붙임) */
.mux-lm .lchk label.on { border-color:#715D54; background:#F7F3F1; font-weight:700; }
/* 신청 가능 매장 카드 ▼(펼치기) 누르는 자리를 넓게 — 보이는 위치는 그대로 */
.mux .lc.sc.can .tgl { padding:8px 10px; margin:-3px -10px -6px -6px; }
/* 문항 카드 사이 간격은 margin 으로 — flex gap 을 모르는 구형 브라우저(iOS 14.4 이하)에서 카드가 붙지 않게 */
.mux .qlist { row-gap:0; }
.mux .qlist > .q ~ .q { margin-top:10px; }   /* 카드 사이에 숨은 input 이 끼어 있어 '+' 가 아니라 '~' */
/* AI 추천 표시: 고르지 않은 추천 보기에 색을 남긴다(새 보기 모양 규칙에 가려지던 것) — 고른 보기는 고른 모양 그대로 */
.mux .q .opw > input:not(:checked) + label.op.ai-rec-label.conf-high { background:rgba(74,137,74,0.13); }
.mux .q .opw > input:not(:checked) + label.op.ai-rec-label.conf-mid { background:rgba(127,106,96,0.13); }
.mux .q .opw > input:not(:checked) + label.op.ai-rec-label.conf-low { background:rgba(160,133,110,0.10); }
/* 리커트(좁은 칸)는 뱃지 자리를 비우지 않는다 — 숫자가 밀리지 않게(뱃지는 칸 모서리에 겹쳐 뜸) */
.mux .q .opw.lk > label.op.ai-rec-label { padding-right:0 !important; }
/* 방문인증 화면 방문 예정일 달력: 칸이 좁아 날짜 동그라미가 겹치던 것 — '입력칸+저장' 줄 오른쪽 끝에 맞춰 넓게 연다(360px 폰에서도 화면 안) */
.mux .kv .v.plan { position:relative; }
.mux .kv .v.plan .schedule-input { position:static; }
.mux .kv .v.plan .schedule-input .schedule-wrapper { width:300px; max-width:calc(100vw - 60px); left:auto; right:0; transform:translate(0, 100%); }
/* ── '지금 모집 중' 카드 줄(프로젝트 탭 맨 위, 2026-10-22) — 마크업은 ms_ux_lib.php msux_rail_html ── */
.mux .rail { margin:2px 0 16px; }
.mux .rail .sec-h .nw { font-size:10px; font-weight:700; color:#fff; background:#E53935; border-radius:8px; padding:1px 6px; line-height:14px; }
.mux .rail .rsub { margin:-4px 2px 8px; font-size:11.5px; }
.mux .rrow { display:flex; gap:10px; overflow-x:auto; padding:2px 0 8px; scroll-snap-type:x mandatory; -webkit-overflow-scrolling:touch; }
.mux .rrow::-webkit-scrollbar { display:none; }
.mux .rcd { flex:0 0 80%; max-width:330px; box-sizing:border-box; scroll-snap-align:start; display:flex; flex-direction:column; background:#fff; border:1px solid #ECE6E3; border-radius:14px; padding:13px 13px 12px; box-shadow:0 3px 10px rgba(113,93,84,.07); }
.mux .rcd:only-child { flex-basis:100%; max-width:none; }
.mux .rcd .bds { display:flex; flex-wrap:wrap; gap:4px; }
.mux .rcd .t { display:block; margin-top:8px; font-size:15px; font-weight:700; color:#222; line-height:1.35; height:2.7em; overflow:hidden; }
.mux .rcd .s { display:flex; flex-wrap:wrap; align-items:center; gap:4px 5px; margin-top:4px; font-size:11.5px; color:#999; }
.mux .rcd .st2 { display:grid; grid-template-columns:1fr 1fr; margin-top:10px; background:#F7F4F2; border-radius:10px; }
.mux .rcd .st2 > div { min-width:0; padding:9px 11px 10px; }
.mux .rcd .st2 > div + div { border-left:1px solid #EAE3DF; }
.mux .rcd .st2 .k { font-size:11px; color:#999; }
.mux .rcd .st2 .big { margin-top:2px; font-size:19px; font-weight:700; color:#222; letter-spacing:-.3px; white-space:nowrap; }
.mux .rcd .st2 .big small { font-size:12px; font-weight:600; color:#AAA; }
.mux .rcd .st2 .big.brand { color:#715D54; }
.mux .rcd .st2 .big.mute { color:#C8BEB9; }
.mux .rcd .st2 .big.red, .mux .rcd .st2 .sm.red { color:#C62828; }
.mux .rcd .st2 .sm { margin-top:3px; font-size:11px; color:#999; white-space:nowrap; }
.mux .rcd .st2 .rbar { height:4px; margin-top:5px; overflow:hidden; background:#E7E1DE; border-radius:2px; }
.mux .rcd .st2 .rbar i { display:block; height:100%; background:#7F6A60; }
.mux .rcd .st2 .rbar.red i { background:#DE5757; }
.mux .rcd .nb { display:flex; flex-wrap:wrap; align-items:center; gap:4px 6px; margin-top:8px; font-size:12px; color:#999; }
.mux .rcd .nb .rnear { white-space:nowrap; }
.mux .rcd .nb .rnear.ok { color:#3B6D11; }
.mux .rcd .fill { flex:1 0 10px; }
.mux .rcd .go { display:flex; align-items:center; justify-content:center; height:40px; border-radius:9px; background:#715D54; color:#fff; font-size:14px; font-weight:700; }
.mux .rcd .go.off { background:#EEE8E5; color:#A9A09B; }
.mux .rcd.prep { background:#FCFAF9; border-style:dashed; box-shadow:none; }
.mux .rcd.prep .soon { display:flex; gap:7px; margin-top:10px; padding:10px 11px; background:#fff; border:1px solid #EFE9E6; border-radius:10px; font-size:12px; color:#8C7469; line-height:1.4; }
.mux .rcd.prep .soon b { display:block; color:#715D54; font-size:13px; }
.mux .rcd.prep .soon svg { flex-shrink:0; margin-top:2px; }