/* CEO 브리핑 딸깍 — 스타일 (md2hwpx/WeeklyBrief topbar 톤 일치) */

:root {
  /* shared/theme.css 가 --bg,--panel,--border,--accent,--accent2,--success,--warn,--text2,--text3 공급(라이트/다크) */
  --text1: var(--text); --err: var(--danger); --toolbar: var(--bg2);
  --r:4px; --tph:40px;
}
* { box-sizing:border-box; }
html,body { margin:0; padding:0; min-height:100%; }
body {
  background:var(--bg); color:var(--text1);
  font-family:-apple-system,BlinkMacSystemFont,'Segoe UI','Malgun Gothic',sans-serif;
  font-size:14px; line-height:1.55; -webkit-font-smoothing:antialiased;
}

/* ── Topbar ── */
.topbar {
  position:fixed; top:0; left:0; right:0; height:var(--tph);
  background:var(--toolbar); border-bottom:1px solid var(--border);
  display:flex; align-items:center; justify-content:space-between;
  padding:0 10px; z-index:100; gap:8px;
}
.tb-left,.tb-right { display:flex; align-items:center; gap:5px; }
.home-link {
  display:flex; align-items:center; gap:5px; padding:5px 9px; border-radius:6px;
  color:var(--text2); text-decoration:none; font-size:11px; font-weight:600;
  background:rgba(74,158,255,0.06); border:1px solid rgba(74,158,255,0.18); transition:all .15s; white-space:nowrap;
}
.home-link:hover { background:rgba(74,158,255,0.14); border-color:var(--accent); color:var(--accent2); }
.sep { width:1px; height:18px; background:var(--border); margin:0 2px; }
.logo { display:flex; align-items:center; gap:5px; color:var(--accent); font-weight:700; font-size:12px; white-space:nowrap; }
.tbtn {
  display:flex; align-items:center; gap:4px; background:none; border:none; cursor:pointer;
  color:var(--text2); padding:4px 7px; border-radius:var(--r); font-size:11.5px; text-decoration:none;
  transition:background .12s,color .12s; white-space:nowrap; font-family:inherit;
}
.tbtn:hover { background:var(--bg2); color:var(--text1); }

/* ── 본문 ── */
.wrap { max-width:760px; margin:0 auto; padding:calc(var(--tph) + 22px) 16px 90px; }
.intro {
  color:var(--text2); font-size:13px; line-height:1.65;
  background:var(--panel); border:1px solid var(--border); border-radius:8px;
  padding:13px 16px; margin:0 0 18px;
}
.intro b { color:var(--text1); }

.card {
  background:var(--panel); border:1px solid var(--border); border-radius:8px;
  padding:16px; margin-bottom:14px;
}
.card-h { margin:0 0 12px; font-size:14px; font-weight:700; color:var(--accent2); }

/* 드롭존 */
.dropzone {
  border:2px dashed var(--border); border-radius:8px; padding:26px 16px;
  text-align:center; cursor:pointer; transition:all .15s; color:var(--text2);
  display:flex; flex-direction:column; align-items:center; gap:9px;
}
.dropzone:hover,.dropzone.dragover { border-color:var(--accent); background:rgba(74,158,255,0.06); color:var(--text1); }
.dropzone svg { color:var(--text3); }
.dz-text { font-size:13px; }
.dz-text b { color:var(--text1); }
.dz-small { padding:14px; flex-direction:row; font-size:12px; margin-top:8px; }

/* 챕터 구성 (자동 / 직접 지정) */
.chapter-config { margin-top:14px; padding-top:14px; border-top:1px dashed var(--border); }
.cc-label { font-size:12px; color:var(--text2); font-weight:600; margin-bottom:8px; }
.cc-label small { color:var(--text3); font-weight:400; }
.mode-toggle { display:flex; gap:6px; background:var(--bg); border:1px solid var(--border); border-radius:8px; padding:4px; }
.mode-btn {
  flex:1; background:none; border:none; cursor:pointer; font-family:inherit;
  color:var(--text2); padding:8px 12px; border-radius:6px; font-size:13px; font-weight:600; transition:all .12s;
}
.mode-btn:hover { color:var(--text1); }
.mode-btn.active { background:rgba(74,158,255,0.14); color:var(--accent2); }

/* 챕터 직접 지정 — 내용 가이드 블록 (자연어 textarea) */
#outlineArea { margin-top:12px; }
#chapterList { display:flex; flex-direction:column; gap:9px; margin:6px 0 10px; }
.chapter-block { background:var(--bg); border:1px solid var(--border); border-radius:8px; padding:10px 11px; }
.chapter-head { display:flex; align-items:center; justify-content:space-between; margin-bottom:7px; }
.chapter-num { font-size:11.5px; font-weight:700; color:var(--accent2); white-space:nowrap; }
.chapter-del { background:none; border:none; color:var(--text3); cursor:pointer; font-size:14px; padding:2px 6px; border-radius:var(--r); }
.chapter-del:hover:not(:disabled) { color:var(--err); background:rgba(255,107,107,0.1); }
.chapter-del:disabled { opacity:.35; cursor:default; }
.chapter-guide {
  width:100%; background:var(--bg); border:1px solid var(--border); border-radius:var(--r);
  color:var(--text1); padding:8px 10px; font-size:13px; font-family:inherit; line-height:1.6;
  resize:vertical; min-height:62px;
}
.chapter-guide:focus { outline:none; border-color:var(--accent); }
.btn-add-chapter {
  width:100%; background:none; border:1px dashed var(--border); border-radius:8px;
  color:var(--text2); padding:9px; font-size:13px; font-weight:600; cursor:pointer; font-family:inherit; transition:all .12s;
}
.btn-add-chapter:hover { border-color:var(--accent); color:var(--accent2); background:rgba(74,158,255,0.05); }

.file-list { display:flex; flex-wrap:wrap; gap:6px; margin-top:10px; }
.file-chip {
  display:inline-flex; align-items:center; gap:6px; font-size:12px;
  background:rgba(74,158,255,0.1); border:1px solid rgba(74,158,255,0.25);
  color:var(--text1); padding:4px 8px; border-radius:999px;
}
.file-x,.ref-x { background:none; border:none; color:var(--text3); cursor:pointer; font-size:12px; padding:0 2px; }
.file-x:hover,.ref-x:hover { color:var(--err); }
.hint { color:var(--text3); font-size:12px; }

/* 폼 그리드 */
.grid2 { display:grid; grid-template-columns:1fr 1fr; gap:10px 14px; }
.grid2 label { display:flex; flex-direction:column; gap:4px; font-size:12px; color:var(--text2); }
.grid2 label.col2 { grid-column:1 / -1; }
.grid2 input, .org input {
  background:var(--bg); border:1px solid var(--border); border-radius:var(--r);
  color:var(--text1); padding:7px 9px; font-size:13px; font-family:inherit;
}
.grid2 input:focus,.org input:focus { outline:none; border-color:var(--accent); }

/* 목표 분량 */
.vol-row { display:flex; align-items:center; gap:14px; margin-top:14px; padding-top:12px; border-top:1px dashed var(--border); flex-wrap:wrap; }
.vol-label { font-size:12px; color:var(--text2); font-weight:600; }
.vol-label small { color:var(--text3); font-weight:400; }
.vol-opts { display:flex; gap:8px; }
.vol-opt {
  display:flex; align-items:center; gap:5px; font-size:13px; color:var(--text2); cursor:pointer;
  padding:5px 12px; border:1px solid var(--border); border-radius:999px; transition:all .12s;
}
.vol-opt:hover { border-color:var(--accent); color:var(--text1); }
.vol-opt input { accent-color:var(--accent); }
.vol-opt:has(input:checked) { background:rgba(74,158,255,0.12); border-color:var(--accent); color:var(--accent2); }

.org { margin-top:12px; }
.org summary { cursor:pointer; color:var(--text2); font-size:12px; padding:4px 0; }
.org summary:hover { color:var(--text1); }
.org .grid2 { margin-top:10px; }

/* 체크 옵션 */
.chk { display:flex; align-items:flex-start; gap:8px; font-size:13px; color:var(--text2); cursor:pointer; line-height:1.5; }
.chk input { margin-top:2px; accent-color:var(--accent); }
.chk b { color:var(--text1); }
.ref-row { margin-top:12px; padding-top:12px; border-top:1px dashed var(--border); }

/* 액션 */
.actions { text-align:center; margin:22px 0 8px; }
.btn-primary {
  background:var(--accent); color:#0a0a0a; border:none; border-radius:8px;
  padding:13px 34px; font-size:15px; font-weight:700; cursor:pointer; font-family:inherit;
  transition:background .15s;
}
.btn-primary:hover:not(:disabled) { background:var(--accent2); }
.btn-primary:disabled { opacity:.6; cursor:default; }

/* 상태 */
.status { margin:14px 0 0; padding:11px 14px; border-radius:8px; font-size:13px; line-height:1.6; }
.status-info { background:rgba(74,158,255,0.1); border:1px solid rgba(74,158,255,0.3); color:var(--accent2); }
.status-ok   { background:rgba(92,215,92,0.1); border:1px solid rgba(92,215,92,0.3); color:var(--success); }
.status-error{ background:rgba(255,107,107,0.1); border:1px solid rgba(255,107,107,0.35); color:var(--err); }

.foot-note { color:var(--text3); font-size:11.5px; line-height:1.6; margin:24px 0 0; text-align:center; }
.foot-note b { color:var(--text2); }

/* v1.1.0 결과 영역 */
.mini-note { color:var(--text3); font-size:11.5px; line-height:1.6; margin:10px 0 0; }
.mini-note b { color:var(--text2); }
.card-sub { font-size:11px; color:var(--text3); font-weight:400; }
.result-actions { display:flex; gap:10px; flex-wrap:wrap; align-items:center; }
.tbtn-lg {
  display:inline-flex; align-items:center; gap:5px; padding:10px 16px; border-radius:8px;
  background:var(--bg2); border:1px solid var(--border); color:var(--text1); font-size:13px;
  text-decoration:none; cursor:pointer; font-family:inherit; transition:all .12s;
}
.tbtn-lg:hover { background:var(--panel); border-color:var(--accent); color:var(--accent2); }
.md-preview {
  margin-top:14px; padding:18px 20px; background:#fbfbfb; color:#1a1a1a; border-radius:8px;
  border:1px solid var(--border); max-height:520px; overflow-y:auto;
  font-size:13px; line-height:1.7;
}
.md-preview h1 { font-size:20px; margin:0 0 6px; }
.md-preview h2 { font-size:16px; margin:16px 0 6px; border-bottom:1px solid #e3e3e3; padding-bottom:3px; }
.md-preview table { border-collapse:collapse; margin:10px 0; width:auto; }
.md-preview th, .md-preview td { border:1px solid #c8c8c8; padding:4px 9px; font-size:12px; }
.md-preview th { background:#eef2f7; }
.md-preview p { margin:4px 0; }

@media (max-width:560px) { .grid2 { grid-template-columns:1fr; } }