/* 마감 카운트다운 판 */
[data-app="deadline-countdown"]{ display:flex; flex-direction:column; gap:10px; word-break:keep-all; overflow-wrap:anywhere; }
/* 가장 가까운 마감 */
[data-app="deadline-countdown"] .dc-head{ padding:10px 12px; border-radius:12px; background:#F1F4F9; border:1px solid #E3E8F0; }
[data-app="deadline-countdown"] .dc-head.soon{ background:#FFF4C7; border-color:#F1D46A; }
[data-app="deadline-countdown"] .dc-head.none{ background:#F5F5F7; border-color:#E6E7EB; }
[data-app="deadline-countdown"] .dc-hk{ margin:0; font-size:12px; font-weight:800; color:#6B717B; }
[data-app="deadline-countdown"] .dc-hn{ display:flex; align-items:center; flex-wrap:wrap; gap:4px 8px; margin:4px 0 0; }
[data-app="deadline-countdown"] .dc-hb{ flex:none; padding:2px 9px; border-radius:8px; background:#1A1A1A; color:#fff; font-size:16px; font-weight:900; font-variant-numeric:tabular-nums; }
[data-app="deadline-countdown"] .dc-head.soon .dc-hb{ background:#7A5A00; }
[data-app="deadline-countdown"] .dc-head.none .dc-hb{ background:#9AA1AC; }
[data-app="deadline-countdown"] .dc-ht{ min-width:0; font-size:17px; font-weight:800; color:#1A1A1A; }
[data-app="deadline-countdown"] .dc-hc{ display:flex; align-items:baseline; justify-content:space-between; flex-wrap:wrap; gap:2px 10px; margin:6px 0 0; font-size:13px; color:#4B5059; }
[data-app="deadline-countdown"] .dc-hr{ display:inline-flex; align-items:baseline; gap:6px; margin-left:auto; }
[data-app="deadline-countdown"] .dc-hl{ font-size:12px; font-weight:700; color:#6B717B; }
[data-app="deadline-countdown"] .dc-hcount{ font-size:14px; font-weight:800; color:#1A1A1A; font-variant-numeric:tabular-nums; white-space:nowrap; }
[data-app="deadline-countdown"] .dc-hcount.big{ font-size:26px; font-weight:900; letter-spacing:.01em; line-height:1.1; }
/* 개수 요약 */
[data-app="deadline-countdown"] .dc-sum{ display:flex; flex-wrap:wrap; gap:4px 12px; margin:0; font-size:12.5px; color:#555B64; }
[data-app="deadline-countdown"] .dc-sum span{ display:inline-flex; align-items:center; gap:4px; white-space:nowrap; }
[data-app="deadline-countdown"] .dc-sum span::before{ content:''; width:9px; height:9px; border-radius:50%; background:#C9CED8; }
[data-app="deadline-countdown"] .dc-sum span.o::before{ background:#D92D20; }
[data-app="deadline-countdown"] .dc-sum span.s::before{ background:#F2C230; }
[data-app="deadline-countdown"] .dc-sum span.d::before{ background:#9AA1AC; }
[data-app="deadline-countdown"] .dc-sum b{ color:#1A1A1A; }
/* 추가 칸 */
[data-app="deadline-countdown"] .dc-add{ display:flex; flex-direction:column; gap:6px; margin:0; padding:10px; border-radius:12px; background:#FAFAFB; border:1px dashed #D9DCE1; }
[data-app="deadline-countdown"] .ndt-in{ font-size:16px; }
[data-app="deadline-countdown"] .dc-t, [data-app="deadline-countdown"] .dc-et{ min-height:42px; }
/* 날짜·시간 칸: 폭이 넉넉하면 한 줄, 폰처럼 좁으면 두 줄로 — 시간 칸은 130px보다 좁으면 「오후 11:」처럼 분이 잘림(10/2 시험) */
[data-app="deadline-countdown"] .dc-dt{ display:flex; flex-wrap:wrap; gap:6px; }
[data-app="deadline-countdown"] .dc-dt > :first-child{ flex:1 1 150px; }
[data-app="deadline-countdown"] .dc-dt > :last-child{ flex:1 1 135px; }
[data-app="deadline-countdown"] .dc-dt label{ display:flex; flex-direction:column; gap:3px; min-width:0; }
[data-app="deadline-countdown"] .dc-dt .ndt-k small{ font-weight:600; color:#8A8F98; }
[data-app="deadline-countdown"] .dc-dt .ndt-in{ min-width:0; min-height:42px; }
[data-app="deadline-countdown"] .dc-addb{ min-height:44px; font-size:15px; }
[data-app="deadline-countdown"] .dc-msg{ margin:0; min-height:1.3em; font-size:12.5px; color:#0D7A43; font-weight:700; }
[data-app="deadline-countdown"] .dc-msg.warn{ color:#B42318; }
[data-app="deadline-countdown"] .dc-msg:empty{ min-height:0; }
/* 마감 줄 */
[data-app="deadline-countdown"] .dc-list, [data-app="deadline-countdown"] .dc-dlist{ list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:6px; }
/* D-숫자 칸은 60px이 기본, 「D-355471」처럼 아주 먼 날짜(연도 오타)는 그 줄만 글 길이만큼 넓힘(배지 밖으로 삐져나오지 않게, 10/2 시험) */
[data-app="deadline-countdown"] .dc-item{ display:grid; grid-template-columns:36px minmax(60px,max-content) minmax(0,1fr); align-items:center; gap:2px 6px; padding:3px 8px 3px 2px; border:1px solid #E6E7EB; border-radius:12px; background:#fff; }
[data-app="deadline-countdown"] .dc-item.soon{ background:#FFF8DC; border-color:#F1D46A; }
[data-app="deadline-countdown"] .dc-item.over{ background:#FFF1F0; border-color:#F4B4AE; }
[data-app="deadline-countdown"] .dc-item.done{ background:#F7F7F8; border-color:#ECEDF0; }
[data-app="deadline-countdown"] .dc-ck{ display:flex; align-items:center; justify-content:center; width:36px; min-height:44px; cursor:pointer; }
[data-app="deadline-countdown"] .dc-chk{ width:20px; height:20px; margin:0; accent-color:#1A1A1A; cursor:pointer; }
[data-app="deadline-countdown"] .dc-b{ justify-self:stretch; padding:3px 4px; border-radius:8px; background:#EEF2FA; color:#314B86; font-size:13px; font-weight:900; text-align:center; white-space:nowrap; font-variant-numeric:tabular-nums; }
[data-app="deadline-countdown"] .dc-item.soon .dc-b{ background:#FFD84D; color:#4A3600; }
[data-app="deadline-countdown"] .dc-item.over .dc-b{ background:#D92D20; color:#fff; }
[data-app="deadline-countdown"] .dc-item.done .dc-b{ background:#E4E5E8; color:#6B717B; font-weight:800; }
[data-app="deadline-countdown"] .dc-open{ position:relative; display:flex; flex-direction:column; align-items:flex-start; gap:1px; min-width:0; min-height:44px; padding:5px 2px; border:0; border-radius:8px; background:none; color:inherit; font:inherit; text-align:left; cursor:pointer; }
[data-app="deadline-countdown"] .dc-open:hover .dc-n{ text-decoration:underline; text-decoration-color:#B9BEC7; text-underline-offset:3px; }
[data-app="deadline-countdown"] .dc-n{ max-width:100%; font-size:14.5px; font-weight:700; line-height:1.4; color:#1A1A1A; }
[data-app="deadline-countdown"] .dc-s{ max-width:100%; font-size:12.5px; line-height:1.4; color:#5B6470; font-variant-numeric:tabular-nums; }
[data-app="deadline-countdown"] .dc-item.soon .dc-s{ color:#6B4E00; font-weight:600; }
[data-app="deadline-countdown"] .dc-item.over .dc-s{ color:#B42318; font-weight:700; }
[data-app="deadline-countdown"] .dc-item.done .dc-n{ color:#8A8F98; text-decoration:line-through; }
[data-app="deadline-countdown"] .dc-item.done .dc-s{ color:#8A8F98; }
[data-app="deadline-countdown"] .dc-ex{ display:inline-block; margin-left:2px; padding:0 6px; border-radius:6px; background:#ECEDF0; color:#6B717B; font-size:11px; font-weight:800; text-decoration:none; vertical-align:1px; }
[data-app="deadline-countdown"] .dc-sr{ position:absolute; width:1px; height:1px; overflow:hidden; clip:rect(0 0 0 0); clip-path:inset(50%); white-space:nowrap; }
[data-app="deadline-countdown"] .dc-empty{ padding:14px 12px; border:1px dashed #D9DCE1; border-radius:12px; color:#6B717B; font-size:13.5px; text-align:center; }
/* 고치는 줄 */
[data-app="deadline-countdown"] .dc-item.editing{ display:block; padding:10px; background:#F3F6FC; border-color:#9DB6EA; }
[data-app="deadline-countdown"] .dc-ef{ display:flex; flex-direction:column; gap:6px; }
/* 끝낸 일 */
[data-app="deadline-countdown"] .dc-done{ border-top:1px solid #ECEDF0; padding-top:6px; }
[data-app="deadline-countdown"] .dc-done summary{ display:flex; align-items:center; gap:6px; min-height:36px; cursor:pointer; font-size:13.5px; font-weight:800; color:#4B5059; list-style:none; }
[data-app="deadline-countdown"] .dc-done summary::-webkit-details-marker{ display:none; }
[data-app="deadline-countdown"] .dc-done summary::before{ content:'▸'; content:'▸' / ''; display:inline-block; width:12px; color:#8A8F98; transition:transform .15s; }
[data-app="deadline-countdown"] .dc-done[open] > summary::before{ transform:rotate(90deg); }
[data-app="deadline-countdown"] .dc-dn{ padding:0 7px; border-radius:999px; background:#ECEDF0; font-size:12px; }
[data-app="deadline-countdown"] .dc-clear{ margin-top:8px; }
[data-app="deadline-countdown"] .dc-foot{ gap:6px; }
[data-app="deadline-countdown"] .dc-note{ margin:0; }
/* 두 번 눌러 확인(NDT.confirm2): 공통 런타임이 누르기 전 폭으로 단추를 묶어 「지우기」(56px)가 「한 번 / 더 / 누르면 / 지워요」 네 줄로 쪼개짐(10/2 시험)
   → 이 도구에서는 확인 문구 길이만큼 넓힘(최대 11em, 넘으면 두 줄) */
[data-app="deadline-countdown"] .ndt-btn.ndt-arm{ width:auto !important; max-width:min(100%, 11em); }
