/* 엑셀로 문서 대량 만들기: 작업 화면 배치. 색·간격은 KAMU 토큰만 쓴다. */
.mm{padding-top:var(--kamu-space-6);display:grid;gap:var(--kamu-space-4);min-width:0}
.mm code{font-size:.95em;background:var(--kamu-color-subtle);border-radius:var(--kamu-radius-sm);padding:0 4px;word-break:break-all}
.mm .small{font-size:var(--kamu-text-xs)}
.mm h2{display:flex;align-items:center;gap:var(--kamu-space-2);font-size:var(--kamu-text-md);font-weight:800;flex-wrap:wrap}
.mm .num{display:inline-grid;place-items:center;width:24px;height:24px;border-radius:50%;background:var(--kamu-color-brand);color:var(--kamu-color-on-brand);font-size:var(--kamu-text-xs);font-weight:800;flex:none}
.mm-intro{display:flex;align-items:center;gap:var(--kamu-space-3);justify-content:space-between;flex-wrap:wrap;color:var(--kamu-color-muted);font-size:var(--kamu-text-sm)}
.mm-intro p{flex:1 1 320px}
.mm-inputs{display:grid;grid-template-columns:1fr 1fr;gap:var(--kamu-space-4)}
.mm-drop{display:grid;gap:var(--kamu-space-2);align-content:start;border-style:dashed;transition:background var(--kamu-duration),border-color var(--kamu-duration);min-width:0}
.mm-drop.drag{border-color:var(--kamu-color-text);background:var(--kamu-color-subtle)}
.mm-drop>p.muted{font-size:var(--kamu-text-sm)}
.mm-info{display:grid;gap:var(--kamu-space-2);min-width:0}
.mm-info:empty{display:none}
.mm-file{font-weight:750;word-break:break-all;margin-top:var(--kamu-space-2)}
.mm-chips{display:flex;flex-wrap:wrap;gap:6px;margin:0;padding:0;list-style:none}
.mm-sheet{max-width:280px}
.mm-step{display:grid;gap:var(--kamu-space-3);min-width:0}
.mm-step>p.muted{font-size:var(--kamu-text-sm)}

/* 열 연결 표 */
.mm-tablewrap{overflow-x:auto}
.mm-map{width:100%;border-collapse:collapse;font-size:var(--kamu-text-sm)}
.mm-map th,.mm-map td{padding:var(--kamu-space-2);border-bottom:1px solid var(--kamu-color-border);text-align:left;vertical-align:middle}
.mm-map thead th{color:var(--kamu-color-muted);font-size:var(--kamu-text-xs);font-weight:700}
.mm-map tbody th{font-weight:600;white-space:nowrap}
.mm-map tbody th code{word-break:keep-all;white-space:nowrap}
.mm-map select{width:100%;min-width:140px}
.mm-map td:last-child{white-space:nowrap}
.mm-warns:empty{display:none}

/* 미리보기 */
.mm-previews{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--kamu-space-3)}
.mm-doc{border:1px solid var(--kamu-color-border);border-radius:var(--kamu-radius-md);background:var(--kamu-color-canvas);overflow:hidden;min-width:0}
.mm-doc header{padding:var(--kamu-space-1) var(--kamu-space-3);font-size:var(--kamu-text-xs);font-weight:700;color:var(--kamu-color-muted);border-bottom:1px solid var(--kamu-color-border)}
.mm-page{background:var(--kamu-color-surface);margin:var(--kamu-space-3);padding:var(--kamu-space-4);border:1px solid var(--kamu-color-border);font-size:var(--kamu-text-xs);line-height:1.7;max-height:360px;overflow:auto;overflow-wrap:anywhere}
.mm-page p{margin:0}
.mm-page p.cell{padding-left:var(--kamu-space-3);border-left:2px solid var(--kamu-color-border)}
.mm-page mark{background:var(--kamu-color-info-soft);color:var(--kamu-color-text);border-radius:2px;padding:0 2px}
.mm-page mark.left{background:var(--kamu-color-warning-soft);color:var(--kamu-color-warning)}
.mm-page mark.empty{background:var(--kamu-color-warning-soft);color:var(--kamu-color-warning);font-style:italic}

/* 받기 */
.mm-modes{border:0;margin:0;padding:0;display:grid;grid-template-columns:1fr 1fr;gap:var(--kamu-space-3);min-width:0}
.mm-mode{display:flex;gap:var(--kamu-space-2);align-items:flex-start;border:1px solid var(--kamu-color-border);border-radius:var(--kamu-radius-md);padding:var(--kamu-space-3);cursor:pointer;min-width:0}
.mm-mode:has(input:checked){border-color:var(--kamu-color-text);box-shadow:inset 0 0 0 1px var(--kamu-color-text)}
.mm-mode input{margin-top:4px;accent-color:var(--kamu-color-text)}
.mm-mode>span{display:grid;gap:2px;font-size:var(--kamu-text-sm)}
.mm-namerow{flex-wrap:nowrap}
.mm-namerow #namePat{flex:1;min-width:0}
.mm-namerow select{width:auto;flex:none;max-width:40%}
.mm-go{gap:var(--kamu-space-3)}
#result{display:grid;gap:var(--kamu-space-2)}
#result:empty{display:none}

@media (max-width:900px){
  .mm-previews{grid-template-columns:1fr 1fr}
}
@media (max-width:620px){
  .mm-inputs,.mm-modes,.mm-previews{grid-template-columns:1fr}
  .mm-map tbody th{white-space:normal}
  .mm-map select{min-width:0}
  .mm-namerow{flex-wrap:wrap}
  .mm-namerow select{max-width:none}
}