/* 돈군(분만 주차 무리) — 일령 관리 주차표 · 일보 방 칩 · 이동 창 질문 */
.ck { --ck-line: var(--line-3, rgba(255,255,255,.15)); }
.ck-hp { display:inline-flex; align-items:center; gap:3px; padding:2px 7px; border-radius:999px; font-size:.78rem; font-weight:800; white-space:nowrap; color:var(--c); background:color-mix(in srgb, var(--c) 16%, transparent); border:1px solid color-mix(in srgb, var(--c) 45%, transparent); }
.ck-hp.now { background:color-mix(in srgb, var(--c) 30%, transparent); }
.ck-hp.old { opacity:.75; font-weight:600; }
.ck-need { display:inline-block; padding:0 6px; border:1px dashed var(--ink-50); border-radius:6px; color:var(--ink-60); font-weight:600; font-size:.74rem; white-space:nowrap; }
.ck-mix { display:inline-block; margin-left:4px; padding:1px 6px; border-radius:6px; font-size:.7rem; font-weight:800; color:var(--warn); background:var(--warn-soft); border:1px solid color-mix(in srgb, var(--warn) 45%, transparent); white-space:nowrap; }
.ck-trail { display:block; color:var(--ink-50); font-size:.72rem; margin-top:2px; white-space:nowrap; }
.ck-legend { display:flex; flex-wrap:wrap; gap:4px 12px; font-size:.74rem; color:var(--ink-70); margin:0 0 10px; }
.ck-legend i { display:inline-block; width:9px; height:9px; border-radius:3px; margin-right:4px; vertical-align:-1px; }
.ck-bar { display:flex; flex-wrap:wrap; gap:8px; align-items:center; justify-content:space-between; margin-bottom:10px; }
.ck-bar .filter-buttons { flex-wrap:nowrap; overflow-x:auto; max-width:100%; }
.ck-bar .filter-btn { white-space:nowrap; flex:0 0 auto; }
.ck-sub { color:var(--ink-60); font-size:.78rem; margin:-4px 0 10px; line-height:1.6; }
.ck-toggle { display:inline-flex; gap:6px; align-items:center; font-size:.8rem; color:var(--ink-70); white-space:nowrap; }

/* 주차표 */
.ck-t1 { min-width:1080px; font-size:.84rem; border-collapse:collapse; width:100%; }
.ck-t1 th, .ck-t1 td { padding:6px 7px; text-align:center; white-space:nowrap; border-bottom:1px solid var(--ck-line); }
.ck-t1 th.l, .ck-t1 td.ck-loc, .ck-t1 td.ck-memo { text-align:left; }
.ck-t1 th { font-size:.76rem; }
.ck-t1 td.ck-w, .ck-t1 th:first-child { position:sticky; left:0; background:var(--surface-solid, #1a1a1a); z-index:1; }
.ck-t1 tbody tr { cursor:pointer; }
.ck-t1 tbody tr:hover td { background:color-mix(in srgb, var(--accent) 8%, transparent); }
/* 고정된 첫 칸(주차)은 칠해도 바탕이 비치지 않게 — 폰은 누른 뒤에도 hover 가 남아, 옆으로 민 일령이 비쳐 '16517' 처럼 겹쳤다 */
.ck-t1 tbody tr:hover td.ck-w { background:linear-gradient(color-mix(in srgb, var(--accent) 8%, transparent), color-mix(in srgb, var(--accent) 8%, transparent)), var(--surface-solid, #1a1a1a); }
.ck-w { font-weight:900; color:var(--t-red); }
.ck-age { font-weight:800; }
.ck-age.hot { color:var(--bad); background:var(--bad-soft); }
.ck-wk { color:var(--ink-70); }
.ck-pre { color:var(--ink-60); font-size:.74rem; }
.ck-d { font-variant-numeric:tabular-nums; }
.ck-d.past { color:var(--ink-50); }
.ck-d.soon { color:var(--t-amber); font-weight:800; }
.ck-memo { color:var(--ink-70); font-size:.76rem; max-width:220px; overflow:hidden; text-overflow:ellipsis; }
.ck-t1 tr.done td:not(.ck-w) { opacity:.55; }
.ck-t1 tr.done td.ck-w { color:var(--ink-50); }   /* 고정 칸은 흐리게 하지 않는다 (흐리면 뒤가 비친다) */
@media (max-width:600px) { .ck-dt .y { display:none; } .ck-t1 { min-width:760px; } .ck-t1 .ph-hide { display:none; } }
/* 주차표 선명 스타일 (2026-10-11 시안 1, docs/STYLE-VIVID.md) — 줄의 --hc = 지금 있는 축사 색.
   주차 동그라미 · 왼쪽 막대 · 일령 막대(210일까지)는 그 색. 150일 넘은 줄만 출하 단계 색(예정 파랑 · 임박 노랑 · 긴급 빨강).
   고정된 주차 칸은 늘 불투명(옆으로 민 칸이 비치지 않게), 그 위에 색을 겹친다 */
.ck-t1 td.ck-w { color:var(--ink); box-shadow:inset 4px 0 0 var(--hc, transparent); }
.ck-t1 .ck-wc { display:inline-grid; place-items:center; min-width:32px; height:32px; padding:0 4px; border-radius:16px; font-weight:900; color:var(--ink);
  background:color-mix(in srgb, var(--hc, var(--ink-50)) 22%, transparent); box-shadow:0 0 0 2px color-mix(in srgb, var(--hc, var(--ink-50)) 55%, transparent); }
.ck-t1 tr.done .ck-wc { color:var(--ink-50); }
.ck-t1 .ck-ab { display:block; width:44px; height:5px; margin:3px auto 0; border-radius:3px; overflow:hidden; background:color-mix(in srgb, var(--ink) 10%, transparent); }
.ck-t1 .ck-ab i { display:block; height:100%; border-radius:3px; background:var(--hc, var(--ink-50)); }
.ck-t1 td.ck-age.hot { background:var(--rt, transparent); }
.ck-t1 .ck-d.past { color:color-mix(in srgb, var(--ink) 35%, transparent); }
.ck-t1 .ck-d.soon { color:var(--ink); font-weight:900; }
.ck-t1 .ck-d.soon span { display:inline-block; padding:2px 8px; border-radius:10px; background:color-mix(in srgb, var(--t-teal) 22%, transparent); box-shadow:inset 0 0 0 1px color-mix(in srgb, var(--t-teal) 55%, transparent); }
.ck-t1 .ck-need { color:var(--t-orange); border-color:color-mix(in srgb, var(--t-orange) 60%, transparent); font-weight:800; }
.ck-t1 tr.v-scheduled { --rt:color-mix(in srgb, var(--t-blue) 9%, transparent); }
.ck-t1 tr.v-upcoming { --rt:color-mix(in srgb, var(--t-amber) 13%, transparent); }
.ck-t1 tr.v-urgent { --rt:color-mix(in srgb, var(--t-red) 14%, transparent); }
.ck-t1 tr[class*="v-"] td { background:var(--rt); }
.ck-t1 tr[class*="v-"] td.ck-w { background:linear-gradient(var(--rt), var(--rt)), var(--surface-solid, #1a1a1a); }
.ck-t1 .badge { font-weight:900; }

/* 자세히 — 보기 창 + 고치기 창(메모 · 위치) 따로 (시안 3, 2026-10-07).
   공통 부품 이름(.modal · .modal-content · .modal-header · .modal-field · .modal-actions · .btn-primary · button.on)을 쓴다.
   밤 모양은 여기서 그리고(일령 관리에는 .modal 기본 모양이 없다), 낮 · 한울 · 태극은 theme.css 가 같은 이름을 덮는다 */
.ck-modal { position:fixed; inset:0; z-index:9000; display:flex; align-items:center; justify-content:center; padding:16px; background:var(--scrim-80, rgba(0,0,0,.6)); }
.ck-modal ~ .ck-modal { z-index:9001; }
.ck-modal .modal-content { width:100%; max-width:520px; max-height:88vh; overflow:auto; box-sizing:border-box; background:var(--surface-solid); border:1px solid var(--line-2); border-radius:16px; padding:18px 20px 20px; color:var(--ink); }
.ck-modal.ck-small .modal-content { max-width:440px; }
@media (max-width:600px) {
  .ck-modal { align-items:flex-end; padding:0; }
  .ck-modal .modal-content { max-width:none; border-radius:18px 18px 0 0; max-height:92vh; padding:16px 16px calc(18px + env(safe-area-inset-bottom)); }
}
.ck-modal .modal-header { display:flex; align-items:center; gap:10px; margin:0 0 12px; padding:0 0 10px; border-bottom:1px solid var(--line); }
.ck-modal .modal-title { flex:1; margin:0; font-size:var(--fs-h2, 1.2rem); font-weight:900; }
.ck-modal .modal-title small { display:block; margin-top:2px; font-size:.8rem; font-weight:600; color:var(--ink-soft); }
.ck-modal button { font:inherit; font-size:var(--fs-ctl, .95rem); font-weight:700; padding:9px 14px; min-height:44px; border-radius:10px; border:1px solid var(--line-2); background:var(--surface-2); color:var(--ink); cursor:pointer; }
.ck-modal .btn-primary, .ck-modal button.on { background:var(--accent); border-color:var(--accent); color:var(--accent-ink); }
.ck-modal .modal-close { margin-left:auto; padding:8px; min-height:0; line-height:0; border-radius:9px; }
.ck-modal .modal-close svg { width:18px; height:18px; }
.ck-modal .modal-actions { display:flex; flex-wrap:wrap; gap:8px; justify-content:flex-end; margin-top:14px; }
.ck-modal .modal-field { display:flex; flex-direction:column; gap:5px; margin:0 0 12px; }
.ck-modal .modal-field label { font-size:.8rem; font-weight:700; color:var(--ink-soft); }
.ck-modal .modal-field input, .ck-modal .modal-field textarea { box-sizing:border-box; width:100%; font:inherit; font-size:var(--fs-ctl, .95rem); padding:10px 12px; border:1px solid var(--line-2); border-radius:10px; background:var(--field, var(--bg)); color:var(--ink); }
.ck-modal .modal-field textarea { min-height:72px; resize:vertical; }
/* 타일 (공통 .tile 모양) — 이유 · 지금 · 180일 세 칸, 출하 날짜 네 칸(폰은 2×2) */
.ck-modal .tiles { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:8px; margin:0 0 12px; }
.ck-modal .tiles.ck-ships { grid-template-columns:repeat(4,minmax(0,1fr)); gap:6px; }
@media (max-width:600px) { .ck-modal .tiles.ck-ships { grid-template-columns:repeat(2,minmax(0,1fr)); } }
.ck-modal .tile { min-width:0; border:1px solid var(--line); border-radius:12px; padding:10px 12px; background:var(--bg); }
.ck-modal .tile .l { font-size:.74rem; font-weight:700; color:var(--ink-soft); }
.ck-modal .tile .v { margin-top:2px; font-size:1.25rem; font-weight:900; font-variant-numeric:tabular-nums; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.ck-modal .tile .v.wrap { white-space:normal; display:flex; flex-wrap:wrap; gap:3px; font-size:1rem; }
.ck-modal .tile .s { margin-top:2px; font-size:.74rem; color:var(--ink-soft); }
.ck-modal .ck-ships .tile { padding:8px 10px; } .ck-modal .ck-ships .tile .v { font-size:.98rem; }
.ck-sec { margin:14px 0 6px; font-size:.8rem; font-weight:800; color:var(--ink-soft); }
.ck-memo { margin:0; white-space:pre-wrap; word-break:break-word; font-size:.9rem; line-height:1.5; }
.ck-hint { margin:6px 0 0; font-size:.78rem; color:var(--ink-soft); }
.ck-tlist { border-left:2px solid var(--ck-line); margin:4px 0 12px 6px; padding-left:14px; display:grid; gap:10px; }
.ck-ti { position:relative; }
.ck-ti .dot { position:absolute; left:-21px; top:4px; width:12px; height:12px; border-radius:50%; background:var(--c); }
.ck-ti b { display:block; }
.ck-ti small { display:block; color:var(--ink-60); font-size:.78rem; }
.ck-warn { display:flex; gap:8px; align-items:flex-start; padding:9px 11px; border-radius:12px; background:var(--warn-soft); border:1px solid color-mix(in srgb, var(--warn) 40%, transparent); color:var(--ink-90); margin-bottom:10px; font-size:.84rem; }
/* 위치 고치기 — 방은 누르기 쉬운 칩 (고른 방 = button.on) */
.ck-rooms { display:grid; gap:2px; }
.ck-rooms .grp { display:grid; grid-template-columns:4.6em 1fr; gap:6px; align-items:start; margin:0 0 6px; }
.ck-rooms .grp > b { padding-top:10px; font-size:.82rem; color:var(--ink-soft); }
.ck-rchips { display:flex; flex-wrap:wrap; gap:6px; }
.ck-modal .ck-rchips button { min-height:40px; padding:6px 12px; border-radius:999px; font-size:.86rem; font-weight:800; }
.ck-other { display:flex; flex-wrap:wrap; gap:6px; align-items:center; }
.ck-other input[type=text] { flex:1 1 120px; min-width:0; height:44px; box-sizing:border-box; padding:0 12px; font:inherit; font-size:var(--fs-ctl, .95rem); border:1px solid var(--line-2); border-radius:10px; background:var(--field, var(--bg)); color:var(--ink); }

/* 인큐 1 · 2 따라가기 */
.ck-seg { display:inline-flex; border:1px solid var(--ck-line); border-radius:12px; overflow:hidden; margin-bottom:10px; }
.ck-seg button { background:none; border:0; color:var(--ink-70); padding:8px 14px; font-weight:800; min-height:40px; }
.ck-seg button.on { background:color-mix(in srgb, var(--accent) 22%, transparent); color:var(--ink-90); }
.ck-seg small { font-weight:600; color:var(--ink-60); margin-left:3px; }
.ck-t3 { width:100%; font-size:.84rem; border-collapse:collapse; }
.ck-t3 th { font-size:.74rem; color:var(--ink-60); padding:6px 4px; }
.ck-t3 td { padding:6px 4px; text-align:center; border-bottom:1px solid var(--ck-line); }
.ck-t3 .ck-w { white-space:nowrap; }
.ck-t3 .ck-w small { display:block; color:var(--ink-60); font-size:.68rem; font-weight:600; }
.ck-rm { display:inline-block; margin:1px; padding:2px 6px; border-radius:7px; font-weight:800; font-size:.78rem; color:var(--c); border:1px solid color-mix(in srgb, var(--c) 45%, transparent); white-space:nowrap; }
.ck-rm.now { background:var(--c); color:#111; }
.ck-sc.empty { color:var(--ink-50); }
.ck-sums { margin-top:14px; }
@media (min-width:900px) { .ck-sums { display:grid; grid-template-columns:1fr 1fr; gap:16px; } }
.ck-sum { margin:10px 0 14px; }
.ck-sumh { display:flex; justify-content:space-between; align-items:center; margin-bottom:6px; }
.ck-sumh small { color:var(--ink-60); }
.ck-sr { display:grid; grid-template-columns:52px 1fr 34px; gap:2px 8px; align-items:center; margin:5px 0; }
.ck-sr b { font-size:.9rem; }
.ck-sb { height:10px; border-radius:5px; background:var(--surface-04); overflow:hidden; }
.ck-sb i { display:block; height:100%; border-radius:5px; }
.ck-sr span { font-size:.78rem; font-weight:800; text-align:right; }
.ck-sr small { grid-column:2/4; font-size:.7rem; color:var(--ink-60); margin-top:-3px; }
.ck-note { font-size:.76rem; color:var(--ink-60); margin:8px 2px; line-height:1.6; }

/* 주차판 → 흐름판 (축사마다 지금 있는 무리, PC 여섯 칸 · 폰은 축사 하나씩) */
.ck-flow { display:grid; grid-template-columns:repeat(6,minmax(0,1fr)); gap:8px; align-items:start; }
.ck-flow-ph { display:none; }
@media (max-width:700px) { .ck-flow { display:none; } .ck-flow-ph { display:block; } }
.ck-fcol { display:flex; flex-direction:column; gap:6px; min-width:0; }
.ck-fh { display:flex; flex-wrap:wrap; justify-content:space-between; align-items:baseline; gap:2px 6px; padding:8px 10px; border-radius:10px; background:color-mix(in srgb, var(--c) 14%, var(--surface-04)); border:1px solid color-mix(in srgb, var(--c) 40%, transparent); }
.ck-fh b { font-weight:900; color:var(--ink-90); white-space:nowrap; }
.ck-fh small { font-size:.7rem; font-weight:700; color:var(--ink-70); white-space:nowrap; }
.ck-fc { display:flex; flex-direction:column; gap:2px; width:100%; text-align:left; padding:8px 9px; border-radius:10px; border:1px solid var(--ck-line); border-left:4px solid var(--c); background:var(--surface-04); color:var(--ink-90); font:inherit; cursor:pointer; }
.ck-fc .r1 { display:flex; justify-content:space-between; align-items:baseline; gap:4px; }
.ck-fc .r1 b { font-size:1.02rem; font-weight:900; }
.ck-fc .r1 span { font-size:.84rem; font-weight:800; }
.ck-fc small { font-size:.74rem; color:var(--ink-70); line-height:1.4; }
.ck-fnone { font-size:.78rem; color:var(--ink-60); margin:4px 2px; }
.ck-fchips { display:flex; gap:6px; overflow-x:auto; padding-bottom:4px; margin-bottom:8px; }
.ck-fchips button { flex:0 0 auto; display:inline-flex; gap:6px; align-items:center; min-height:38px; padding:6px 12px; border-radius:999px; border:1px solid var(--ck-line); background:var(--surface-04); color:var(--ink-80); font-weight:800; font-size:.84rem; white-space:nowrap; }
.ck-fchips button i { width:9px; height:9px; border-radius:50%; background:var(--c); }
.ck-fchips button.on { background:color-mix(in srgb, var(--accent) 22%, transparent); border-color:var(--accent); color:var(--ink-90); }
.ck-funk { display:flex; flex-wrap:wrap; gap:6px; align-items:center; margin-top:10px; font-size:.8rem; color:var(--ink-70); }
.ck-funk button { min-height:34px; padding:4px 10px; border-radius:9px; border:1px dashed var(--ink-50); background:none; color:var(--ink-90); font-weight:800; }
.ck-funk small { color:var(--ink-60); font-weight:600; }
.ck-funk.oth button { border-style:solid; border-color:color-mix(in srgb, var(--t-teal) 50%, transparent); }

/* 할 일 */
.ck-tiles4 { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:10px; margin-bottom:12px; }
@media (max-width:700px) { .ck-tiles4 { grid-template-columns:repeat(2,minmax(0,1fr)); gap:8px; } }
.ck-tile { display:flex; flex-direction:column; gap:3px; min-width:0; padding:11px 12px; border-radius:12px; background:var(--surface-04); border:1px solid var(--ck-line); border-top:3px solid var(--c); }
.ck-tile small { font-size:.76rem; font-weight:700; color:var(--ink-60); }
.ck-tile b { font-size:1.35rem; font-weight:900; color:var(--ink-90); line-height:1.2; }
.ck-tile span { font-size:.78rem; font-weight:700; color:var(--ink-80); line-height:1.45; }
.ck-todo { display:flex; flex-direction:column; gap:8px; }
.ck-do { display:flex; align-items:center; gap:10px; width:100%; text-align:left; padding:10px 12px; border-radius:12px; border:1px solid var(--ck-line); background:var(--surface-04); color:var(--ink-90); font:inherit; text-decoration:none; cursor:pointer; }
.ck-do .k { flex:0 0 auto; width:30px; height:30px; border-radius:9px; display:grid; place-items:center; font-weight:900; color:var(--c); background:color-mix(in srgb, var(--c) 18%, transparent); }
.ck-do .t { flex:1; min-width:0; }
.ck-do .t b { display:block; font-size:.94rem; }
.ck-do .t small { display:block; font-size:.78rem; color:var(--ink-60); }
.ck-do .go { flex:0 0 auto; padding:6px 10px; border-radius:9px; border:1px solid var(--ck-line); font-size:.8rem; font-weight:800; color:var(--ink-90); white-space:nowrap; }
.ck-h3 { display:flex; align-items:baseline; gap:8px; flex-wrap:wrap; margin:16px 0 4px; font-weight:900; color:var(--ink-90); }
.ck-h3 small { font-weight:600; font-size:.76rem; color:var(--ink-60); }
.ck-ship { display:grid; grid-template-columns:repeat(8,minmax(0,1fr)); gap:6px; align-items:end; padding-top:6px; }
.ck-ship > div { display:flex; flex-direction:column; align-items:center; gap:2px; min-width:0; }
.ck-ship .colm { height:84px; width:100%; display:flex; align-items:flex-end; justify-content:center; }
.ck-ship i { display:block; width:62%; max-width:40px; min-height:3px; border-radius:6px 6px 2px 2px; background:var(--t-teal); opacity:.75; }
.ck-ship .now i { background:var(--accent); opacity:1; }
.ck-ship b { font-size:.78rem; color:var(--ink-90); }
.ck-ship small { font-size:.7rem; color:var(--ink-60); }
.ck-ship em { font-style:normal; font-size:.68rem; color:var(--ink-60); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; max-width:100%; }

/* 일령 막대 */
.ck-legend i.unk { background:repeating-linear-gradient(45deg, var(--ink-50) 0 3px, transparent 3px 6px); }
.ck-legend i.win { border:1.5px dashed var(--t-amber); background:none; }
.ck-gantt { display:flex; flex-direction:column; gap:4px; }
.ck-gx, .ck-gr { display:grid; grid-template-columns:92px 1fr 96px; gap:8px; align-items:center; }
.ck-gx .ax { position:relative; height:18px; font-size:.7rem; color:var(--ink-60); }
.ck-gx .ax span { position:absolute; transform:translateX(-50%); white-space:nowrap; }
.ck-gx .ax span:first-child { transform:none; }
.ck-gx .ax .ph { display:none; }
.ck-gr { width:100%; padding:3px 0; border:0; border-radius:8px; background:none; color:var(--ink-90); font:inherit; text-align:left; cursor:pointer; }
.ck-gr:hover { background:var(--surface-04); }
.ck-gr .lb { font-weight:900; font-size:.86rem; white-space:nowrap; }
.ck-gr .lb small { margin-left:4px; font-weight:700; color:var(--ink-60); }
.ck-gr .bar { position:relative; height:16px; border-radius:5px; background:var(--surface-04); overflow:hidden; }
.ck-gr .seg { position:absolute; top:0; bottom:0; }
.ck-gr .seg.unk { background:repeating-linear-gradient(45deg, var(--ink-50) 0 4px, transparent 4px 8px); opacity:.6; }
.ck-gr .win { position:absolute; top:0; bottom:0; border:1.5px dashed var(--t-amber); border-radius:4px; background:color-mix(in srgb, var(--t-amber) 10%, transparent); z-index:1; }
.ck-gr .tip { position:absolute; top:0; bottom:0; width:3px; margin-left:-1px; background:var(--ink-90); border-radius:2px; z-index:2; }
.ck-gr .end { font-size:.78rem; font-weight:800; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
@media (max-width:700px) {
  .ck-gx, .ck-gr { grid-template-columns:62px 1fr 56px; gap:6px; }
  .ck-gx .ax .pc { display:none; } .ck-gx .ax .ph { display:inline; }
  .ck-gr .lb small { display:block; margin-left:0; font-size:.7rem; }
}

/* 일보: 방 이름 옆 주차 칩 */
.ck-chips { display:inline-flex; flex-wrap:wrap; gap:4px; margin-left:6px; vertical-align:middle; }
.ck-chip { display:inline-flex; gap:3px; align-items:center; padding:1px 7px; border-radius:999px; font-size:.72rem; font-weight:800; color:var(--t-red); background:color-mix(in srgb, var(--t-red) 14%, transparent); border:1px solid color-mix(in srgb, var(--t-red) 40%, transparent); white-space:nowrap; }
.ck-chip small { color:var(--ink-70); font-weight:600; }
/* 줄 빼기 (관리자, 줄 끝) */
.ck-hide { min-height:32px; padding:4px 10px; border-radius:8px; border:1px solid var(--ck-line); background:var(--surface-04); color:var(--ink-80); font-size:.76rem; font-weight:800; white-space:nowrap; }