/* ================================================================
   JCI Admin — 참석 로그 · 출석 QR 통합 (출석 Q4 · 관리자 웹 화면설계서 화면 16 · 17)
   화면 구성 = 시안 5A(탭 분리 — 사장님 선택 10-06 "A안이 좋아"):
     html_preview/출석QR_Q4/시안5A_참석로그_탭분리.html — 간격 · 글자 크기는 그 파일 값 그대로,
     색은 admin.css 토큰 var(--c-*) + 아래 .att-v2 출석 토큰만.
   ----------------------------------------------------------------
   ⚠ 이 파일의 모든 규칙은 뿌리 클래스 .att-v2 아래에만 둔다.
     숨김 스위치(admin-app.js window.JC_ATTENDANCE_QR_WEB · attQrWebEnabled())가 꺼져 있으면
     화면에 .att-v2 요소가 생기지 않으므로 이 파일은 아무 효과가 없다(지시서 17 Q4 §3 · §5-1).
     body 에 직접 붙는 것(작은 창 · 실행 취소 줄 · 실패 토스트 · 머리/메모 말풍선)도 .att-v2 를 달고 나온다.
     (@keyframes att-q-spin · att-q-live 는 이름만 정의 — .att-v2 안에서만 쓴다)
   ⚠ admin.css 수정 금지 · 전역 @page 금지(인쇄 화면은 새 창 문서 안에 둔다).
   ================================================================ */

.att-v2 {
    /* 출석 토큰 — 앞 7개 = 시안 3 · 5A :root · 앱 AppColors 와 같은 값 */
    --att-ok-text: #0E7C4F;
    --att-ok-mark: #15A66B;
    --att-ok-bg: #E6F6EF;
    --att-late-text: #A65B00;
    --att-late-mark: #C27400;
    --att-late-bg: #FEF3E2;
    --att-proxy: #46586C;
    /* 12px 회색 글자 기준(UX 검토 7) — 기록 없음 기호 · 조사 X · 예고(불참) */
    --att-none-text: #6B7684;
    /* 불참 ✕ — 앱 AttendanceMarkKind.absent 와 같은 회색 계열(빨강 아님) · '기록 없음 —'보다 진하게(확인된 기록) */
    --att-absent-mark: #4B5563;
    /* 대상 아닌 칸 · 출석을 받지 않은 칸의 연한 바탕(시안 3 · 5A 같은 값) */
    --att-off-bg: #F7F9FC;
    /* 시안 5A 전용 — 표 안 가는 선 · 옅은 조사 O 글자 */
    --att-line: #EEF2F6;
    --att-ink-2: #4B5563;

    /* 한글은 어절 단위로만 줄바꿈(사장님 절대 규칙 09-13 · 14) */
    word-break: keep-all;
    overflow-wrap: anywhere;
}
.att-v2 [hidden] { display: none !important; }

/* ---------- 작은 그림 · 기호(색만으로 가르지 않게 모양이 다르다) ---------- */
.att-v2 .att-ic {
    width: 16px; height: 16px; flex: none;
    fill: none; stroke: currentColor; stroke-width: 2;
    stroke-linecap: round; stroke-linejoin: round;
}
.att-v2 .att-mk {
    display: inline-block; flex: none; box-sizing: border-box;
    width: 12px; height: 12px; border-radius: 50%;
    vertical-align: middle; forced-color-adjust: none;
}
.att-v2 .att-mk-ok { background: var(--att-ok-mark); }
.att-v2 .att-mk-late {
    border: 2px solid var(--att-late-mark);
    background: linear-gradient(90deg, var(--att-late-mark) 50%, transparent 50%);
}
.att-v2 .att-mk-proxy {
    width: 10px; height: 10px; border-radius: 1px; margin: 0 1px;
    border: 2px solid var(--att-proxy); transform: rotate(45deg);
}
.att-v2 .att-mk-none { width: 12px; height: 2px; border-radius: 1px; background: var(--att-none-text); }
.att-v2 .att-mk.att-mk-sm { width: 8px; height: 8px; }
/* 참석 통합(지시서 32) — 불참 ✕ · 예고(참석) ○ · 예고(불참) ⊘(예고 둘은 연한 색 · 점선 — 결산 전 캠페인 답) */
.att-v2 .att-mk-absent { position: relative; border-radius: 0; }
.att-v2 .att-mk-absent::before,
.att-v2 .att-mk-absent::after {
    content: ""; position: absolute; left: 50%; top: 50%; width: 13px; height: 2px; border-radius: 1px;
    background: var(--att-absent-mark); transform: translate(-50%, -50%) rotate(45deg);
}
.att-v2 .att-mk-absent::after { transform: translate(-50%, -50%) rotate(-45deg); }
.att-v2 .att-mk-iyes { border: 2px dotted var(--att-ok-mark); opacity: .8; }
.att-v2 .att-mk-ino { position: relative; border: 2px dotted var(--att-none-text); opacity: .8; }
.att-v2 .att-mk-ino::after {
    content: ""; position: absolute; left: 50%; top: 50%; width: 11px; height: 2px; border-radius: 1px;
    background: var(--att-none-text); transform: translate(-50%, -50%) rotate(-45deg);
}
/* 칠한 아이콘(⋯) */
.att-v2 .att-ic.att-ic-fill { fill: currentColor; stroke: none; }

/* 받는 중 점(시안 5A .live) */
.att-v2 .att-live {
    display: inline-block; flex: none; width: 8px; height: 8px; border-radius: 50%;
    background: var(--att-ok-mark); animation: att-q-live 2s ease-out infinite;
}
.att-v2 .att-live.att-live-sm { width: 7px; height: 7px; }
@keyframes att-q-live {
    0% { box-shadow: 0 0 0 0 color-mix(in srgb, var(--att-ok-mark) 45%, transparent); }
    70% { box-shadow: 0 0 0 7px color-mix(in srgb, var(--att-ok-mark) 0%, transparent); }
    100% { box-shadow: 0 0 0 0 color-mix(in srgb, var(--att-ok-mark) 0%, transparent); }
}

/* 처리 중 — 누른 버튼만 작은 로딩 */
.att-v2 .att-busy { position: relative; }
.att-v2 .att-busy::after {
    content: ""; display: inline-block; width: 11px; height: 11px; margin-left: 6px;
    border: 2px solid currentColor; border-right-color: transparent; border-radius: 50%;
    animation: att-q-spin .7s linear infinite; vertical-align: -1px;
}
@keyframes att-q-spin { to { transform: rotate(360deg); } }
@media (prefers-reduced-motion: reduce) {
    .att-v2 .att-busy::after { animation: none; border-right-color: currentColor; opacity: .5; }
    .att-v2 .att-live { animation: none; box-shadow: 0 0 0 3px color-mix(in srgb, var(--att-ok-mark) 18%, transparent); }
}

/* 키보드 초점 — 본문(#att-root)은 시안 5A 값(파랑 2px) · body 에 붙는 요소는 먹색 */
.att-v2 :is(button, input, [tabindex]):focus-visible { outline: 2px solid var(--c-text); outline-offset: 1px; }
#att-root.att-v2 :is(button, input, [tabindex]):focus-visible { outline: 2px solid var(--c-primary); outline-offset: 2px; }
#att-root.att-v2 button.att-act-el:focus-visible { outline-offset: -2px; }
.att-v2 .toggle-switch input:focus-visible + .toggle-slider { outline: 2px solid var(--c-primary); outline-offset: 2px; }

/* ---------- 화면 틀 · 탭 3개(시안 5A .ct · .tabs · .tab · .tcount) ---------- */
.att-v2.att-page { display: flex; flex-direction: column; gap: 24px; min-width: 0; }
.att-v2 .att-tabs { display: flex; gap: 6px; border-bottom: 1px solid var(--c-border); margin-top: -6px; }
.att-v2 .att-tab {
    position: relative; height: 50px; padding: 0 14px; display: inline-flex; align-items: center; gap: 8px;
    border: 0; background: none; color: var(--c-text-sub); font: inherit; font-size: 15px; font-weight: 600; cursor: pointer;
}
.att-v2 .att-tab:hover { color: var(--c-text); }
.att-v2 .att-tab.att-on { color: var(--c-text); font-weight: 700; }
.att-v2 .att-tab.att-on::after {
    content: ""; position: absolute; left: 10px; right: 10px; bottom: -1px; height: 2px; border-radius: 2px;
    background: var(--c-primary);
}
.att-v2 .att-tcount {
    display: inline-flex; align-items: center; gap: 6px; height: 24px; padding: 0 9px; border-radius: 999px;
    background: var(--att-ok-bg); color: var(--att-ok-text); font-size: 14px; font-weight: 700; line-height: 1;
}
.att-v2 .att-panel-col { display: flex; flex-direction: column; gap: 24px; min-width: 0; }

/* 카드 · 단추(시안 5A .card · .btn) */
.att-v2 .att-card {
    min-width: 0; background: var(--c-bg-card); border: 1px solid var(--c-border); border-radius: 12px;
    box-shadow: var(--shadow-sm);
}
.att-v2 .att-btn {
    height: 40px; padding: 0 16px; display: inline-flex; align-items: center; justify-content: center; gap: 6px;
    border: 1px solid var(--c-border); border-radius: 8px; background: var(--c-bg-card); color: var(--c-text);
    font: inherit; font-size: 14px; font-weight: 600; white-space: nowrap; cursor: pointer;
}
.att-v2 .att-btn .att-ic { width: 18px; height: 18px; }
.att-v2 .att-btn:hover:not(:disabled) { border-color: var(--c-primary); color: var(--c-primary); }
.att-v2 .att-btn.att-btn-pri { background: var(--c-primary); border-color: var(--c-primary); color: var(--c-bg-card); }
.att-v2 .att-btn.att-btn-pri:hover:not(:disabled) { background: var(--c-primary-hover); border-color: var(--c-primary-hover); color: var(--c-bg-card); }
.att-v2 .att-btn:disabled { opacity: .5; cursor: not-allowed; }
.att-v2 .att-grid2 { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 24px; }
@media (max-width: 1099px) {
    .att-v2 .att-grid2 { grid-template-columns: minmax(0, 1fr); }
}

/* ---------- [참석 로그] 탭 — 표 위 줄(시안 5A .tbar · .chips · .tgls · .ibtn) ---------- */
.att-v2 .att-tbar {
    position: relative; display: flex; align-items: center; flex-wrap: wrap; gap: 12px 20px;
    padding: 18px 20px 18px 24px;
}
.att-v2 .att-year-tabs { display: flex; gap: 8px; flex-wrap: wrap; }
.att-v2 .att-year-tabs .chip {
    height: 36px; padding: 0 16px; border: 1px solid var(--c-border); border-radius: 999px;
    background: var(--c-bg-card); color: var(--c-text-sub); font-size: 14px; font-weight: 600; letter-spacing: 0;
}
.att-v2 .att-year-tabs .chip:hover { border-color: var(--c-primary); color: var(--c-primary); background: var(--c-bg-card); }
.att-v2 .att-year-tabs .chip.chip-active,
.att-v2 .att-year-tabs .chip.chip-active:hover { background: var(--c-primary); border-color: var(--c-primary); color: var(--c-bg-card); }
.att-v2 .att-frozen { display: inline-flex; align-items: center; }
.att-v2 .att-tgls { margin-left: auto; display: flex; align-items: center; flex-wrap: wrap; gap: 12px 22px; }
.att-v2 .att-tgl {
    display: inline-flex; align-items: center; gap: 10px; cursor: pointer; white-space: nowrap;
    color: var(--c-text-sub); font-size: 14px; font-weight: 600;
}
.att-v2 .att-tgl:has(input:checked) { color: var(--c-text); }
.att-v2 .att-tgl .toggle-switch input:checked + .toggle-slider { background: var(--c-primary); }
.att-v2 .att-ibtn {
    width: 36px; height: 36px; padding: 0; display: grid; place-items: center;
    border: 1px solid var(--c-border); border-radius: 8px; background: var(--c-bg-card); color: var(--c-text-sub); cursor: pointer;
}
.att-v2 .att-ibtn .att-ic { width: 19px; height: 19px; }
.att-v2 .att-ibtn:hover,
.att-v2 .att-ibtn[aria-expanded="true"] { border-color: var(--c-primary); color: var(--c-primary); background: var(--c-primary-bg); }

/* ⓘ 기호 설명 말풍선(시안 5A .pop · .pop-g · .pop-l) */
.att-v2 .att-legend-pop {
    position: absolute; top: calc(100% - 8px); right: 20px; z-index: 20; width: min(540px, calc(100% - 40px));
    padding: 18px 20px 16px; border: 1px solid var(--c-border); border-radius: 12px;
    background: var(--c-bg-card); box-shadow: var(--shadow-lg); text-align: left;
}
.att-v2 .att-legend-pop::before {
    content: ""; position: absolute; top: -7px; right: 12px; width: 12px; height: 12px;
    background: var(--c-bg-card); border-left: 1px solid var(--c-border); border-top: 1px solid var(--c-border);
    transform: rotate(45deg);
}
.att-v2 .att-legend-pop h5 { margin-bottom: 10px; font-size: 15px; font-weight: 700; color: var(--c-text); }
.att-v2 .att-pop-g { display: grid; grid-template-columns: auto 1fr; gap: 10px 14px; align-items: baseline; font-size: 14px; }
.att-v2 .att-pop-g dt { font-weight: 700; color: var(--c-text); white-space: nowrap; }
.att-v2 .att-pop-g dd { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 14px; color: var(--att-ink-2); }
.att-v2 .att-pop-g dd > span { display: inline-flex; align-items: center; gap: 6px; white-space: nowrap; }
.att-v2 .att-pop-g dd > span.att-wrap { display: inline; white-space: normal; }
.att-v2 .att-pop-l {
    margin-top: 12px; padding-top: 12px; border-top: 1px solid var(--att-line); list-style: none;
    display: flex; flex-direction: column; gap: 6px; font-size: 14px; color: var(--att-ink-2);
}
.att-v2 .att-pop-l li { position: relative; padding-left: 12px; }
.att-v2 .att-pop-l li::before {
    content: ""; position: absolute; left: 0; top: 9px; width: 4px; height: 4px; border-radius: 50%; background: var(--c-text-hint);
}

/* ---------- 간결한 표(기본 — 행사마다 칸 1개 · 시안 5A .tw · .at) ---------- */
.att-v2 .att-c-scroll { overflow-x: auto; border-top: 1px solid var(--c-border); border-radius: 0 0 12px 12px; scroll-padding: 0 240px 0 212px; }
.att-v2 .att-c-table { table-layout: fixed; border-collapse: separate; border-spacing: 0; width: 100%; font-variant-numeric: tabular-nums; }
/* 관리자웹 공통 표 규칙(admin.css · theme-doc.css 의 thead th · tbody td 여백 · 윗줄 · 자간)을 이 표에서만 걷어 낸다 */
.att-v2 .att-c-table th,
.att-v2 .att-c-table td { padding: 0; background: var(--c-bg-card); }
.att-v2 .att-c-table thead th {
    vertical-align: bottom; white-space: nowrap; border-top: 0; border-bottom: 1px solid var(--c-border);
    font-size: 14px; font-weight: 600; letter-spacing: normal; text-transform: none; color: var(--c-text-sub);
}
.att-v2 .att-c-table .att-c-nm {
    position: sticky; left: 0; z-index: 2; text-align: left; padding: 0 12px 0 24px;
    overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.att-v2 .att-c-table .att-c-ps {
    position: sticky; left: 120px; z-index: 2; text-align: left; padding: 0 8px;
    overflow: hidden; text-overflow: ellipsis; white-space: nowrap; box-shadow: inset -1px 0 0 var(--c-border);
}
.att-v2 .att-c-table thead .att-c-nm,
.att-v2 .att-c-table thead .att-c-ps { padding-bottom: 10px; }
.att-v2 .att-c-table .att-c-ev { padding: 0; text-align: center; box-shadow: inset 1px 0 0 var(--att-line); }
.att-v2 .att-c-table .att-c-ps + .att-c-ev { box-shadow: none; }
.att-v2 .att-c-table thead .att-c-ev { padding: 10px 5px 8px; cursor: default; }
/* 행사 이름 2줄 말줄임(화면설계서 16-4 — 앞이 같은 '2026년도 …' 이름도 구별) · 1줄 이름만 있으면 머리 높이 그대로 */
.att-v2 .att-c-table .att-c-n {
    display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; line-clamp: 2;
    max-width: 100%; margin: 0 auto; overflow: hidden; white-space: normal;
    font-size: 14px; font-weight: 700; line-height: 20px; color: var(--c-text);
}
.att-v2 .att-c-table .att-c-d {
    display: flex; align-items: center; justify-content: center; gap: 6px;
    font-size: 13px; font-weight: 500; line-height: 18px; color: var(--c-text-sub);
}
/* 머리 숫자 '참석 n · 지각 n · 불참 n · 예고 n'(지시서 32 ④-1) — 좁은 열에서도 끊기지 않게 2×2 */
.att-v2 .att-c-table .att-c-k {
    display: grid; grid-template-columns: repeat(2, max-content); justify-content: center; gap: 0 8px;
    margin-top: 4px; font-size: 12.5px; font-weight: 500; line-height: 18px; color: var(--c-text-sub);
}
.att-v2 .att-c-table .att-c-k > span { white-space: nowrap; }
.att-v2 .att-c-table .att-c-k b { font-weight: 700; color: var(--c-text); }
.att-v2 .att-c-table .att-c-k .att-z b { font-weight: 500; color: var(--c-text-sub); }
.att-v2 .att-c-table .att-c-k .att-c-k1 { grid-column: 1 / -1; }
/* '일정' 작은 표시(열 머리 · 고르기 창) */
.att-v2 .att-c-tag {
    display: inline-flex; align-items: center; height: 18px; margin-left: 4px; padding: 0 5px; border-radius: 4px;
    background: var(--att-line); color: var(--c-text-sub); font-size: 12px; font-weight: 700; line-height: 1; white-space: nowrap;
}
/* 결산 자리 — 결산 전 [결산 확정] · 결산 뒤 '결산 완료 MM-DD' + [결산 취소] · 받는 중 '마감 뒤 결산'(열마다 높이 같게) */
.att-v2 .att-c-st {
    min-height: 50px; margin-top: 6px; display: flex; flex-direction: column; align-items: center; justify-content: flex-start; gap: 2px;
}
.att-v2 .att-c-settle {
    height: 28px; padding: 0 9px; border: 1px solid var(--c-border); border-radius: 6px;
    background: var(--c-bg-card); color: var(--c-text); font: inherit; font-size: 13px; font-weight: 700; white-space: nowrap; cursor: pointer;
}
.att-v2 .att-c-settle:hover:not(:disabled) { border-color: var(--c-primary); color: var(--c-primary); }
.att-v2 .att-c-settle:disabled { opacity: .5; cursor: progress; }
.att-v2 .att-c-done {
    display: inline-flex; align-items: center; gap: 3px; height: 20px;
    font-size: 12.5px; font-weight: 700; color: var(--att-ok-text); white-space: nowrap;
}
.att-v2 .att-c-done .att-ic { width: 14px; height: 14px; stroke-width: 2.6; }
.att-v2 .att-c-unsettle {
    height: 28px; padding: 0 6px; border: 0; border-radius: 6px; background: none;
    color: var(--c-text-sub); font: inherit; font-size: 12.5px; font-weight: 600; text-decoration: underline; text-underline-offset: 2px;
    white-space: nowrap; cursor: pointer;
}
.att-v2 .att-c-unsettle:hover:not(:disabled) { color: var(--c-text); background: var(--att-off-bg); }
.att-v2 .att-c-unsettle:disabled { opacity: .5; cursor: progress; }
.att-v2 .att-c-note { max-width: 100%; font-size: 12px; font-weight: 500; line-height: 16px; color: var(--c-text-sub); white-space: normal; text-align: center; }
/* 고르기 창에서 옮겨 간 열 — 잠깐 테두리 */
.att-v2 th.att-flash { box-shadow: inset 0 0 0 2px var(--c-primary) !important; }
.att-v2 .att-c-table th.att-c-off,
.att-v2 .att-c-table td.att-c-off,
.att-v2 .att-c-table td.att-act-cell-off { background: var(--att-off-bg); }
/* 행 끝(오른쪽 고정) 5칸 — 출석 · 지각 · 위임 · 불참(44 · 44 · 44 · 44) + 출석률(64) = 240 — attendance-log.js attQrRenderCompact 와 같음 */
.att-v2 .att-c-table .att-c-s { position: sticky; z-index: 2; text-align: center; }
.att-v2 .att-c-table .att-c-s1 { right: 196px; box-shadow: inset 1px 0 0 var(--c-border); }
.att-v2 .att-c-table .att-c-s2 { right: 152px; }
.att-v2 .att-c-table .att-c-s3 { right: 108px; }
.att-v2 .att-c-table .att-c-s4 { right: 64px; }
.att-v2 .att-c-table .att-c-s5 { right: 0; box-shadow: inset 1px 0 0 var(--att-line); }
.att-v2 .att-c-table thead .att-c-sg {
    position: sticky; right: 64px; z-index: 3; height: 40px; padding: 0 8px 2px; border-bottom: 0;
    text-align: center; font-weight: 500; color: var(--c-text-sub); box-shadow: inset 1px 0 0 var(--c-border);
}
.att-v2 .att-c-table thead tr.att-c-r2 th.att-c-s { height: 40px; padding: 0 0 10px; }
/* 출석률 머리 — '출석 받은 행사 N회 기준'은 출석률에만(지시서 32 ④-1) */
.att-v2 .att-c-table thead th.att-c-rh {
    z-index: 3; padding: 0 4px 10px; white-space: normal; vertical-align: bottom;
    font-weight: 700; line-height: 18px; color: var(--c-text-sub);
}
.att-v2 .att-c-table thead th.att-c-rh span { display: block; margin-top: 2px; font-size: 12px; font-weight: 500; line-height: 15px; }
.att-v2 .att-c-table tbody td { height: 48px; border-bottom: 1px solid var(--att-line); font-size: 14px; }
.att-v2 .att-c-table tbody tr:last-child td { border-bottom: 0; }
.att-v2 .att-c-table tbody .att-c-nm { font-weight: 600; color: var(--c-text); }
.att-v2 .att-c-table tbody .att-c-ps { color: var(--c-text-sub); }
.att-v2 .att-c-table tbody .att-c-s1 { font-weight: 700; color: var(--c-text); }
.att-v2 .att-c-table tbody .att-c-s5 { font-weight: 800; color: var(--c-text); }
.att-v2 .att-c-table .att-c-z { font-weight: 500; color: var(--c-text-sub); }
.att-v2 .att-c-table .att-c-lt { font-weight: 700; color: var(--att-late-text); }
.att-v2 .att-c-table .att-c-px { font-weight: 700; color: var(--att-proxy); }
.att-v2 .att-c-table .att-c-ab { font-weight: 700; color: var(--att-absent-mark); }
.att-v2 .att-c-table .att-c-sp { padding: 0; }
/* 출석을 받지 않은 행사의 조사 O/X — 옅게 · 메모 점(마우스를 올리면 내용) */
.att-v2 .att-c-sv { position: relative; display: inline-block; font-size: 14px; line-height: 1; }
.att-v2 .att-c-sv.att-c-o { font-weight: 700; color: var(--att-ink-2); }
.att-v2 .att-c-sv.att-c-x { font-weight: 500; color: var(--c-text-sub); }
.att-v2 .att-c-sv.att-c-memo::after {
    content: ""; position: absolute; top: -3px; right: -8px; width: 6px; height: 6px; border-radius: 50%;
    background: var(--att-late-mark);
}

/* 조사 X — 12px 회색 글자 대비 기준(UX 검토 7 · 16-2) */
.att-v2 .attendance-table .att-x,
.att-v2 .att-legend .att-x { color: var(--att-none-text); }

/* ---------- 자세히 보기 표(조사 · 출석 값 두 칸 + 숫자 줄) ---------- */
.att-v2 .att-d-scroll { margin-top: 0; border-top: 1px solid var(--c-border); border-radius: 0 0 12px 12px; scroll-padding: 0 264px 0 204px; }
.att-v2 .att-q-table thead th { padding: 8px 4px; }
.att-v2 .att-q-table thead tr.att-h2 th { top: var(--att-h2-top, 92px); border-top: 0; padding: 6px 2px 8px; }
.att-v2 .att-q-table th.att-ev {
    height: 92px; padding: 10px 6px 8px; text-align: center; vertical-align: bottom;
    border-left: 1px solid var(--c-border);
}
.att-v2 .att-q-table th.att-ev-live { box-shadow: inset 0 2px 0 var(--c-text); }
.att-v2 .att-q-table .att-ev-title > span {
    display: -webkit-box; -webkit-line-clamp: 2; line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden;
    font-size: 13px; font-weight: 700; line-height: 1.35; color: var(--c-text); white-space: normal;
}
.att-v2 .att-q-table .att-ev-title[data-tip] { cursor: default; }
.att-v2 .att-q-table .att-ev-date { margin-top: 3px; font-size: 12px; font-weight: 500; color: var(--c-text-sub); }
.att-v2 .att-q-table .att-ev-tag {
    display: inline-flex; align-items: center; gap: 5px; margin-top: 2px;
    font-size: 12px; font-weight: 700; color: var(--att-ok-text); white-space: nowrap;
}
.att-v2 .att-q-table th.att-sv-h,
.att-v2 .att-q-table th.att-ac-h { text-align: center; font-weight: 500; vertical-align: bottom; }
.att-v2 .att-q-table th.att-sv-h { border-left: 1px solid var(--c-border); }
.att-v2 .att-q-table th.att-ac-h-off { background: var(--att-off-bg); }
.att-v2 .att-q-table thead th b { display: block; margin-bottom: 2px; font-size: 12px; font-weight: 800; color: var(--c-text); }
.att-v2 .att-q-table thead th .att-t,
.att-v2 .att-q-table thead th .att-h {
    display: block; padding: 0; overflow: visible; white-space: nowrap;
    font-size: 12px; line-height: 1.45; text-align: center;
}
.att-v2 .att-q-table .att-t-zero,
.att-v2 .att-q-table .att-h-zero,
.att-v2 .att-q-table .att-h-none { color: var(--c-text-sub); font-weight: 500; }
.att-v2 .att-q-table .att-h-ok { color: var(--att-ok-text); font-weight: 700; }
.att-v2 .att-q-table .att-h-late { color: var(--att-late-text); font-weight: 700; }
.att-v2 .att-q-table .att-h-proxy { color: var(--att-proxy); font-weight: 700; }
.att-v2 .att-q-table .att-h-absent { color: var(--att-absent-mark); font-weight: 700; }
.att-v2 .att-q-table .att-h-intent { color: var(--c-text-sub); font-weight: 700; }
.att-v2 .att-q-table .att-ev-date .att-c-tag { vertical-align: 1px; }

.att-v2 .att-q-table td.att-sv { border-left: 1px solid var(--c-border); }
.att-v2 .att-q-table td.att-act { padding: 0; text-align: center; }
/* 대상 아닌 칸 · 출석을 받지 않은 칸 = 출석률에 들지 않는 칸 → 연한 바탕 */
.att-v2 .att-q-table tbody td.att-act-cell-off { background: var(--att-off-bg); }
.att-v2 .att-act-el {
    display: flex; align-items: center; justify-content: center;
    width: 100%; height: 100%; min-height: 45px; margin: 0; padding: 0;
    border: 0; background: transparent; color: inherit; font: inherit;
}
.att-v2 button.att-act-el { cursor: pointer; }
.att-v2 button.att-act-el:hover { background: var(--c-primary-bg); }
.att-v2 button.att-act-el:focus-visible { outline: 2px solid var(--c-text); outline-offset: -2px; }
.att-v2 .att-act-el.att-act-sel { box-shadow: inset 0 0 0 2px var(--c-text); }
.att-v2 .att-act-el.att-act-ro { cursor: default; }
.att-v2 button.att-act-el.att-busy { cursor: progress; }

/* 출석 값 칸의 ⋯(작은 메뉴 — 정시 · 지각 · 불참 · 지움) — 칸 오른쪽 아래 · 마우스를 올리거나 칸에 초점이 있을 때만 보임
   (터치 화면은 늘 보임 · 키보드는 칸에서 Shift+F10) · 누르는 자리 28px */
.att-v2 td.att-act { position: relative; }
.att-v2 .att-more {
    position: absolute; right: 1px; bottom: 1px; width: 28px; height: 28px; padding: 0;
    display: grid; place-items: center; border: 0; border-radius: 6px;
    background: transparent; color: var(--c-text-sub); cursor: pointer;
    opacity: 0; transition: opacity .12s ease;
}
.att-v2 .att-more .att-ic { width: 18px; height: 18px; }
.att-v2 td.att-act:hover .att-more,
.att-v2 td.att-act:focus-within .att-more,
.att-v2 .att-more[aria-expanded="true"] { opacity: 1; }
.att-v2 .att-more:hover,
.att-v2 .att-more[aria-expanded="true"] { background: var(--att-line); color: var(--c-text); }
@media (hover: none) {
    .att-v2 .att-more { opacity: .7; }
}
@media (prefers-reduced-motion: reduce) {
    .att-v2 .att-more { transition: none; }
}
/* 간결 표 — 참석 조사 메모가 있으면 기호 옆 점(마우스를 올리면 칸 말풍선에 메모) */
.att-v2 .att-mkb { position: relative; display: inline-flex; align-items: center; justify-content: center; min-width: 12px; min-height: 12px; }
.att-v2 .att-mkb.att-mkb-memo::after {
    content: ""; position: absolute; top: -5px; right: -9px; width: 6px; height: 6px; border-radius: 50%;
    background: var(--att-late-mark);
}

/* 행 끝(오른쪽 고정) 5칸 — 출석 · 지각 · 위임 · 불참(48 · 48 · 48 · 48) + 출석률(72) = 264(서버 값 그대로) */
.att-v2 .att-q-table .att-s { position: sticky; z-index: 2; text-align: center; font-variant-numeric: tabular-nums; }
.att-v2 .att-q-table .att-s1 { right: 216px; border-left: 1px solid var(--c-border); }
.att-v2 .att-q-table .att-s2 { right: 168px; }
.att-v2 .att-q-table .att-s3 { right: 120px; }
.att-v2 .att-q-table .att-s4 { right: 72px; }
.att-v2 .att-q-table .att-s5 { right: 0; border-left: 1px solid var(--att-line); }
.att-v2 .att-q-table thead th.att-s,
.att-v2 .att-q-table thead th.att-sum-h { z-index: 5; }
.att-v2 .att-q-table thead th.att-s { vertical-align: bottom; font-size: 12px; font-weight: 800; color: var(--c-text); }
.att-v2 .att-q-table thead th.att-sum-h {
    position: sticky; right: 72px; border-left: 1px solid var(--c-border);
    vertical-align: middle; font-size: 13px; font-weight: 800; color: var(--c-text);
}
.att-v2 .att-q-table thead th.att-sum-h span,
.att-v2 .att-q-table thead th.att-rate-h span { display: block; margin-top: 2px; font-size: 12px; font-weight: 500; color: var(--c-text-sub); }
.att-v2 .att-q-table thead th.att-rate-h { white-space: normal; line-height: 1.3; }
/* 홀수 줄만 흰 바탕을 준다 — 짝수 · 특우회원 · 마우스 올림 줄은 지금 표 규칙(admin.css · theme-doc.css)을 그대로 따른다 */
:where(.att-v2) .att-q-table tbody td.att-s { background: var(--c-bg-card); }
.att-v2 .att-q-table tbody td.att-s1,
.att-v2 .att-q-table tbody td.att-s5 { font-size: 14px; font-weight: 800; color: var(--c-text); }
.att-v2 .att-q-table tbody td.att-s2,
.att-v2 .att-q-table tbody td.att-s3,
.att-v2 .att-q-table tbody td.att-s4 { color: var(--c-text-sub); }
.att-v2 .att-q-table tbody td.att-s2.att-s-has { color: var(--att-late-text); font-weight: 700; }
.att-v2 .att-q-table tbody td.att-s4.att-s-ab { color: var(--att-absent-mark); font-weight: 700; }

/* ---------- [출석 받기] 탭 — 받는 중 행사 카드(시안 5A .sec-h · .sc · .empty) ---------- */
.att-v2 .att-sec-h { display: flex; align-items: center; flex-wrap: wrap; gap: 12px; }
.att-v2 .att-sec-h h3 { font-size: 17px; font-weight: 700; letter-spacing: -.01em; color: var(--c-text); }
.att-v2 .att-sec-h .att-cnt { font-size: 15px; font-weight: 600; color: var(--c-text-sub); }
.att-v2 .att-sec-h .att-btn { margin-left: auto; }
.att-v2 .att-sc { display: flex; flex-direction: column; padding: 22px 24px 24px; }
.att-v2 .att-sc-top { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.att-v2 .att-pill {
    display: inline-flex; align-items: center; gap: 7px; height: 28px; padding: 0 11px; border-radius: 999px;
    background: var(--att-ok-bg); color: var(--att-ok-text); font-size: 14px; font-weight: 700;
}
.att-v2 .att-sc-date { font-size: 14px; color: var(--c-text-sub); font-variant-numeric: tabular-nums; }
.att-v2 .att-sc h4 { margin-top: 14px; font-size: 19px; font-weight: 700; line-height: 1.35; letter-spacing: -.015em; color: var(--c-text); }
.att-v2 .att-sc-line {
    display: flex; align-items: center; flex-wrap: wrap; gap: 4px 6px; margin-top: 6px;
    font-size: 14px; color: var(--c-text-sub); font-variant-numeric: tabular-nums;
}
.att-v2 .att-sc-line .att-arw { color: var(--c-text-hint); }
.att-v2 .att-res { display: inline-flex; align-items: center; gap: 6px; font-weight: 700; }
.att-v2 .att-res.att-res-ok { color: var(--att-ok-text); }
.att-v2 .att-res.att-res-late { color: var(--att-late-text); }
.att-v2 .att-sc-bot {
    display: flex; align-items: flex-end; justify-content: space-between; flex-wrap: wrap; gap: 16px;
    margin-top: 20px; padding-top: 18px; border-top: 1px solid var(--att-line);
}
.att-v2 .att-big-lb { font-size: 14px; font-weight: 600; color: var(--c-text-sub); }
.att-v2 .att-big { display: flex; align-items: baseline; gap: 3px; margin-top: 2px; color: var(--c-text); }
.att-v2 .att-big b { font-size: 38px; font-weight: 800; line-height: 1; letter-spacing: -.02em; font-variant-numeric: tabular-nums; }
.att-v2 .att-big span { font-size: 17px; font-weight: 700; }
.att-v2 .att-brk {
    display: flex; align-items: center; flex-wrap: wrap; gap: 6px; margin-top: 8px;
    font-size: 14px; color: var(--c-text-sub); font-variant-numeric: tabular-nums;
}
.att-v2 .att-acts { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 8px; }
.att-v2 .att-sc-err { margin-top: 12px; font-size: 14px; font-weight: 600; color: var(--c-warning); }
.att-v2 .att-empty { display: flex; align-items: center; flex-wrap: wrap; gap: 12px; padding: 18px 24px; font-size: 15px; color: var(--c-text-sub); }
.att-v2 .att-empty > .att-ic { width: 22px; height: 22px; color: var(--c-text-hint); }
.att-v2 .att-empty b { font-weight: 700; color: var(--c-text); }
.att-v2 .att-empty .att-btn { margin-left: auto; }

/* ---------- [설정 · 인쇄 QR] 탭 — 카드 2장(시안 5A .setc · .opt · .pq) ---------- */
.att-v2 .att-setc { display: flex; flex-direction: column; padding: 24px; }
.att-v2 .att-setc h3 { font-size: 17px; font-weight: 700; letter-spacing: -.01em; color: var(--c-text); }
.att-v2 .att-setc .att-sub { margin-top: 4px; font-size: 14px; color: var(--c-text-sub); }
.att-v2 .att-opts { display: flex; flex-direction: column; gap: 10px; margin-top: 20px; }
.att-v2 .att-opt {
    display: flex; gap: 12px; padding: 14px 16px; border: 1px solid var(--c-border); border-radius: 10px;
    background: var(--c-bg-card); cursor: pointer;
}
.att-v2 .att-opt.att-on { border-color: var(--c-primary); background: var(--c-primary-bg); }
.att-v2 .att-opt input {
    -webkit-appearance: none; appearance: none; flex: none; width: 18px; height: 18px; margin: 2px 0 0;
    border: 2px solid var(--c-text-hint); border-radius: 50%; background: var(--c-bg-card); cursor: pointer;
}
.att-v2 .att-opt input:checked {
    border-color: var(--c-primary);
    background: radial-gradient(circle, var(--c-primary) 0 4px, var(--c-bg-card) 4.5px);
}
.att-v2 .att-opt.att-dis { background: var(--att-off-bg); cursor: not-allowed; }
.att-v2 .att-opt.att-dis input { border-color: var(--c-border); background: var(--att-off-bg); cursor: not-allowed; }
.att-v2 .att-opt.att-dis b { color: var(--c-text-sub); }
.att-v2 .att-opt.att-ro,
.att-v2 .att-opt.att-ro input { cursor: default; }
.att-v2 .att-opt b { display: flex; align-items: center; flex-wrap: wrap; gap: 6px 8px; font-size: 15px; font-weight: 700; line-height: 22px; color: var(--c-text); }
.att-v2 .att-opt .att-rad-desc { display: block; margin-top: 2px; font-size: 14px; color: var(--c-text-sub); }
.att-v2 .att-tag {
    display: inline-flex; align-items: center; gap: 4px; height: 24px; padding: 0 8px; border-radius: 6px;
    background: var(--att-line); color: var(--c-text-sub); font-size: 14px; font-weight: 600;
}
.att-v2 .att-tag .att-ic { width: 14px; height: 14px; }
.att-v2 .att-setc .att-note { margin-top: 16px; font-size: 14px; color: var(--c-text-sub); }
.att-v2 .att-setc .att-foot { display: flex; align-items: center; justify-content: flex-end; flex-wrap: wrap; gap: 12px; margin-top: auto; padding-top: 20px; }
.att-v2 .att-set-ro { font-size: 14px; font-weight: 600; color: var(--c-text); }
.att-v2 .att-inline-err { margin-top: 10px; font-size: 14px; font-weight: 600; color: var(--c-warning); }
.att-v2 .att-inline-err:empty { display: none; }
.att-v2 .att-inline-err .att-btn { margin-left: 8px; }
.att-v2 .att-acts.att-acts-start { justify-content: flex-start; margin-top: 20px; }
.att-v2 .att-pq { display: flex; flex-wrap: wrap; align-items: flex-start; gap: 20px; margin-top: 20px; }
/* QR 그림 자리 — 지시서 Q4 확인 1(웹 QR 그림 부품) 사장님 답 전 임시 네모 */
.att-v2 .att-qrph {
    flex: none; width: 148px; height: 148px; display: flex; flex-direction: column; align-items: center; justify-content: center;
    gap: 8px; padding: 8px; border: 1.5px dashed var(--c-border); border-radius: 10px; background: var(--att-off-bg);
    text-align: center; font-size: 14px; color: var(--c-text-sub);
}
.att-v2 .att-qrph .att-ic { width: 34px; height: 34px; color: var(--c-text-hint); stroke-width: 1.4; }
.att-v2 .att-pqt { flex: 1; min-width: 200px; }
.att-v2 .att-pqt > b { display: block; font-size: 16px; font-weight: 700; color: var(--c-text); }
.att-v2 .att-pqt .att-m { margin-top: 4px; font-size: 14px; color: var(--c-text-sub); font-variant-numeric: tabular-nums; }
.att-v2 .att-pqt .att-acts { justify-content: flex-start; margin-top: 16px; }
.att-v2 .att-warn { display: flex; align-items: flex-start; gap: 6px; margin-top: 14px; font-size: 14px; font-weight: 600; color: var(--att-late-text); }
.att-v2 .att-warn .att-ic { width: 18px; height: 18px; margin-top: 1px; }

/* ---------- 실제 칸 작은 창(body 에 띄움 — 표 감싸개가 overflow:auto 라 안에 두면 잘림) ---------- */
.att-v2.att-pop {
    position: fixed; z-index: 400; width: 300px; max-width: calc(100vw - 16px);
    padding: 14px 16px 12px; border: 1px solid var(--c-border); border-radius: 3px;
    background: var(--c-bg-card); color: var(--c-text); box-shadow: var(--shadow-lg);
    font-size: 13px; text-align: left;
}
.att-v2.att-pop .att-pop-x {
    position: absolute; top: 6px; right: 6px; width: 32px; height: 32px;
    display: grid; place-items: center; padding: 0; border: 0; border-radius: 2px;
    background: transparent; color: var(--c-text-sub); cursor: pointer;
}
.att-v2.att-pop .att-pop-x:hover { background: var(--att-off-bg); color: var(--c-text); }
.att-v2.att-pop .att-pop-x .att-ic { width: 18px; height: 18px; }
.att-v2.att-pop .att-pop-head { padding-right: 28px; color: var(--c-text-sub); }
.att-v2.att-pop .att-pop-head b { font-size: 14px; font-weight: 800; color: var(--c-text); }
.att-v2.att-pop .att-pop-now { display: flex; align-items: center; gap: 7px; margin-top: 6px; color: var(--c-text); font-variant-numeric: tabular-nums; }
.att-v2.att-pop .att-pop-off { margin-top: 4px; font-size: 12px; color: var(--c-text-sub); }
.att-v2.att-pop .att-pop-btns { display: flex; gap: 6px; margin-top: 12px; }
.att-v2.att-pop .att-pop-now > span { min-width: 0; }
.att-v2.att-pop .att-pop-btn {
    flex: 1; min-height: 36px; display: inline-flex; align-items: center; justify-content: center; gap: 6px;
    border: 1px solid var(--c-border); border-radius: 3px; background: var(--c-bg-card); color: var(--c-text);
    font: inherit; font-size: 13px; font-weight: 700; cursor: pointer;
}
.att-v2.att-pop .att-pop-btn:hover:not(:disabled) { border-color: var(--c-text); }
.att-v2.att-pop .att-pop-btn.att-on { background: var(--c-text); border-color: var(--c-text); color: var(--c-bg-card); }
.att-v2.att-pop .att-pop-btn.att-on .att-mk-ok { background: var(--c-bg-card); }
.att-v2.att-pop .att-pop-btn.att-on .att-mk-late {
    border-color: var(--c-bg-card);
    background: linear-gradient(90deg, var(--c-bg-card) 50%, transparent 50%);
}
.att-v2.att-pop .att-pop-btn.att-on .att-mk-absent::before,
.att-v2.att-pop .att-pop-btn.att-on .att-mk-absent::after { background: var(--c-bg-card); }
/* 예고(캠페인 답)인 값 — 그 값 단추에 점선 테두리(채움은 실제 기록만) */
.att-v2.att-pop .att-pop-btn.att-hint { border-style: dashed; border-color: var(--c-text-sub); }
.att-v2.att-pop .att-pop-btn:disabled { opacity: .45; cursor: not-allowed; }
.att-v2.att-pop .att-pop-btn[aria-disabled="true"] { cursor: progress; }
.att-v2.att-pop .att-pop-err { margin-top: 8px; font-size: 13px; font-weight: 600; color: var(--c-warning); }
.att-v2.att-pop .att-pop-err:empty { display: none; }
.att-v2.att-pop .att-pop-foot { margin-top: 10px; font-size: 12px; color: var(--c-text-sub); }
.att-v2.att-pop .att-pop-arrow {
    position: absolute; left: var(--att-arrow-x, 50%); bottom: -6px; width: 10px; height: 10px;
    background: var(--c-bg-card); border-right: 1px solid var(--c-border); border-bottom: 1px solid var(--c-border);
    transform: translateX(-50%) rotate(45deg);
}
.att-v2.att-pop.att-pop-down .att-pop-arrow {
    bottom: auto; top: -6px; border-right: 0; border-bottom: 0;
    border-left: 1px solid var(--c-border); border-top: 1px solid var(--c-border);
}

/* ---------- 확인 창 · 행사 고르기 창(openModal — 바깥 클릭으로 닫히지 않음) ---------- */
.att-v2.att-dlg { padding: 22px 24px 18px; }
.att-v2.att-dlg .att-dlg-title { margin-bottom: 10px; font-size: 18px; font-weight: 700; color: var(--c-text); }
.att-v2.att-dlg .att-dlg-msg { font-size: 15px; line-height: 1.6; color: var(--c-text-sub); }
.att-v2.att-dlg .att-dlg-acts { display: flex; justify-content: flex-end; gap: 8px; margin-top: 20px; }
.att-v2 .att-pick-list { max-height: 50vh; overflow-y: auto; border-top: 1px solid var(--c-border); }
.att-v2 .att-pick-row {
    display: flex; align-items: center; gap: 10px; min-height: 48px; padding: 8px 4px;
    border-bottom: 1px solid var(--c-border); cursor: pointer;
}
.att-v2 .att-pick-row input { width: 18px; height: 18px; flex: none; accent-color: var(--c-text); cursor: pointer; }
.att-v2 .att-pick-title { flex: 1; min-width: 0; font-weight: 700; color: var(--c-text); }
.att-v2 .att-pick-title small { display: block; margin-top: 2px; font-size: 13px; font-weight: 500; color: var(--c-text-sub); }
.att-v2 .att-pick-date { color: var(--c-text-sub); white-space: nowrap; font-variant-numeric: tabular-nums; }
.att-v2 .att-pick-kind {
    padding: 0 6px; border: 1px solid var(--c-border); border-radius: 2px;
    font-size: 12px; color: var(--c-text-sub); white-space: nowrap;
}
.att-v2 .att-pick-kind.att-pick-done { border-color: var(--att-ok-bg); background: var(--att-ok-bg); color: var(--att-ok-text); font-weight: 700; }
.att-v2 .att-pick-empty { padding: 12px 4px 14px; color: var(--c-text-sub); border-bottom: 1px solid var(--c-border); }
/* 고르기 창 묶음 단추 — [출석 받기 n] [지난 행사 결산 n](지시서 32 ④-1) */
.att-v2 .att-seg { display: flex; gap: 6px; margin: 4px 0 8px; }
.att-v2 .att-seg-btn {
    flex: 1; min-height: 40px; display: inline-flex; align-items: center; justify-content: center; gap: 6px;
    padding: 0 10px; border: 1px solid var(--c-border); border-radius: 8px;
    background: var(--c-bg-card); color: var(--c-text-sub); font: inherit; font-size: 14px; font-weight: 700; cursor: pointer;
}
.att-v2 .att-seg-btn span { font-weight: 600; font-variant-numeric: tabular-nums; color: var(--c-text-hint); }
.att-v2 .att-seg-btn:hover { border-color: var(--c-primary); color: var(--c-primary); }
.att-v2 .att-seg-btn.att-on { border-color: var(--c-primary); background: var(--c-primary-bg); color: var(--c-primary); }
.att-v2 .att-seg-btn.att-on span { color: var(--c-primary); }
.att-v2 .att-pick-help { margin: 0 0 8px; font-size: 13px; color: var(--c-text-sub); }

/* '서버 적용 대기' 줄(지시서 32 — 새 함수 · 새 키가 서버에 아직 없을 때 · 막지 않음) */
.att-v2 .att-wait {
    display: flex; align-items: center; gap: 8px; margin: 0 20px 16px 24px; padding: 10px 14px;
    border: 1px solid var(--c-border); border-radius: 8px; background: var(--att-off-bg);
    font-size: 14px; font-weight: 600; color: var(--c-text);
}
.att-v2 .att-wait .att-ic { color: var(--c-text-sub); }
/* 화면 읽기 전용 글(칸 사용법 — aria-describedby) */
.att-v2 .att-sr {
    position: absolute; width: 1px; height: 1px; margin: -1px; padding: 0; overflow: hidden;
    clip: rect(0 0 0 0); clip-path: inset(50%); white-space: nowrap; border: 0;
}

/* ---------- 실행 취소 줄(화면 아래 고정 · 10초) ---------- */
.att-v2.att-undo {
    position: fixed; left: 50%; bottom: 24px; transform: translateX(-50%); z-index: 900;
    display: flex; align-items: center; gap: 16px; max-width: calc(100vw - 32px);
    padding: 8px 8px 8px 18px; border-radius: 3px;
    background: var(--c-text); color: var(--c-bg-card); box-shadow: var(--shadow-lg);
    font-size: 14px; font-weight: 600;
}
.att-v2.att-undo button {
    min-height: 36px; padding: 0 14px; border: 1px solid var(--c-bg-card); border-radius: 2px;
    background: transparent; color: var(--c-bg-card); font: inherit; font-weight: 700; cursor: pointer; white-space: nowrap;
}
.att-v2.att-undo button:hover:not(:disabled) { background: var(--c-bg-card); color: var(--c-text); }
.att-v2.att-undo button:focus-visible { outline: 2px solid var(--c-bg-card); outline-offset: 2px; }

/* 실패 토스트 — 빨강 대신 먹색(공용 showAdminToast 는 그대로 · 지시서 §4 빨강 금지) */
.att-v2.att-toast-note { background: var(--c-text); }

/* ---------- 머리 · 메모 말풍선 — 기존 부품(admin.css .att-floating-tip)에 새 경로가 att-v2 를 함께 달 때만
   (한글 어절 단위 줄바꿈 · 최대 320px · 줄 나눔 그대로 — 지금 경로(꺼짐)의 말풍선은 그대로) ---------- */
.att-floating-tip.att-v2 { word-break: keep-all; overflow-wrap: anywhere; max-width: 320px; white-space: pre-line; }