#chapterTemplateDialog { width: min(1040px, calc(100vw - 40px)); max-width: none; height: min(820px, calc(100vh - 40px)); max-height: none; padding: 0; border: 1px solid #b9cad9; border-radius: 11px; background: #fff; }
#chapterTemplateDialog::backdrop { background: rgba(38, 57, 76, .18); backdrop-filter: none; }
.chapter-template-form { width: 100%; height: 100%; min-width: 0; display: flex; flex-direction: column; overflow: hidden; }
.chapter-template-form .dialog-head { flex: 0 0 auto; padding: 18px 24px 14px; background: linear-gradient(90deg, #fff, #f6faff); }
.chapter-template-form .dialog-head h3 { font-size: 22px; }
.chapter-template-form .dialog-head p:last-child { margin: 7px 0 0; color: #607b91; font-size: 13px; }
.chapter-template-body { min-height: 0; flex: 1; display: flex; flex-direction: column; padding: 16px 24px 12px; overflow: hidden; }
.template-meta { flex: 0 0 auto; margin: 0 0 12px; padding: 10px 13px; border: 1px solid #d7e5f0; border-radius: 6px; background: #f0f7fc; color: #42627d; font-size: 12px; line-height: 1.55; }
.template-config { flex: 0 0 auto; display: grid; grid-template-columns: minmax(280px, .85fr) minmax(300px, 1.15fr); gap: 14px; align-items: end; margin-bottom: 13px; }
.template-scope { display: grid; grid-template-columns: 78px minmax(0, 1fr); align-items: center; gap: 9px; margin: 0; color: #355a77; }
.template-scope select { min-width: 0; height: 38px; padding: 7px 10px; }
.template-config-tip { min-height: 38px; display: grid; grid-template-columns: 64px minmax(0, 1fr); gap: 8px; align-items: center; padding: 8px 11px; border-left: 3px solid #b7d9f4; background: #f8fbfe; color: #6d8498; font-size: 11px; line-height: 1.4; }
.template-config-tip strong { color: #315a7d; font-size: 12px; }
.template-preview-head { flex: 0 0 auto; display: flex; align-items: center; justify-content: space-between; min-height: 38px; padding: 0 11px; border: 1px solid #d3e1eb; border-bottom: 0; border-radius: 7px 7px 0 0; background: #eaf3fa; color: #42627c; font-size: 11px; }
.template-preview-head div { display: flex; align-items: baseline; gap: 10px; }
.template-preview-head strong { color: #2c5578; font-size: 13px; }
.template-preview-head span { color: #6d8498; }
.template-preview { min-height: 0; flex: 1; overflow: auto; border: 1px solid #d3e1eb; border-radius: 0 0 7px 7px; background: #fff; }
.template-preview .template-row { display: flex; align-items: center; min-width: 0; min-height: 38px; padding: 7px 12px; padding-left: calc(12px + min(var(--depth, 0), 8) * 20px); border-bottom: 1px solid #edf1f4; color: #30475b; }
.template-preview .template-row:hover { background: #f6faff; }
.template-preview .template-row:last-child { border-bottom: 0; }
.template-preview code { flex: 0 0 88px; min-width: 0; color: #56738c; font-size: 11px; }
.template-preview .template-row span { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.template-preview em { margin-left: 9px; padding: 2px 6px; border-radius: 10px; background: #e7f6ef; color: #137a63; font-size: 10px; font-style: normal; white-space: nowrap; }
.template-more { padding: 10px 14px; color: #668197; font-size: 12px; background: #f8fbfe; }
.chapter-template-form > .dialog-actions { flex: 0 0 auto; min-height: 64px; padding: 12px 24px; background: #fbfdff; }
@media (max-width: 760px) {
  #chapterTemplateDialog { width: calc(100vw - 20px); height: calc(100vh - 20px); }
  .chapter-template-form .dialog-head, .chapter-template-body { padding-left: 14px; padding-right: 14px; }
  .template-config { grid-template-columns: 1fr; }
  .template-preview-head > span { display: none; }
  .chapter-template-form > .dialog-actions { padding: 10px 14px; }
}

/* Chapter initialization: compact controls and a stable preview area. */
#chapterTemplateDialog{width:min(1120px,calc(100vw - 48px));height:min(860px,calc(100vh - 48px))}
#chapterTemplateDialog .chapter-template-form{max-width:none;padding:0}
#chapterTemplateDialog .dialog-head{padding:18px 22px 14px;align-items:flex-start}
#chapterTemplateDialog .dialog-head h3{font-size:21px;margin:0}
#chapterTemplateDialog .dialog-head .eyebrow{margin-bottom:6px}
#chapterTemplateDialog .dialog-head p:last-child{line-height:1.6}
#chapterTemplateDialog .dialog-close{flex-shrink:0}
#chapterTemplateDialog .chapter-template-body{padding:14px 22px 10px}
#chapterTemplateDialog .template-meta{display:flex;align-items:center;flex-wrap:wrap;gap:8px 24px;padding:10px 14px;margin-bottom:12px}
#chapterTemplateDialog .template-meta>span{display:flex;align-items:baseline;gap:8px;min-width:0}
#chapterTemplateDialog .template-meta small{font-size:12px;color:#718499;white-space:nowrap}
#chapterTemplateDialog .template-meta b{font-size:13px;font-weight:600;overflow-wrap:anywhere}
#chapterTemplateDialog .template-config{display:flex;align-items:center;gap:20px;margin-bottom:14px;flex-wrap:wrap}
#chapterTemplateDialog .template-scope{display:flex;flex-direction:row;align-items:center;gap:10px;margin:0;font-size:13px;white-space:nowrap}
#chapterTemplateDialog .template-scope select{width:240px;height:36px;margin:0;padding:5px 10px}
#chapterTemplateDialog .template-config-tip{flex:1;min-width:280px;background:none;border:0;padding:0;min-height:36px;font-size:12px}
#chapterTemplateDialog .template-preview-head{min-height:38px;padding:8px 12px;gap:12px}
#chapterTemplateDialog .template-preview-head>div{flex-wrap:wrap;gap:4px 10px}
#chapterTemplateDialog .template-row{min-height:33px;padding-top:6px;padding-bottom:6px;font-size:13px;line-height:1.5}
#chapterTemplateDialog .template-row code{flex-basis:82px;font-variant-numeric:tabular-nums}
#chapterTemplateDialog .template-row span{white-space:normal;overflow-wrap:anywhere}
#chapterTemplateDialog .consent-note{max-width:none;margin:9px 0 0;padding:0;font-size:12px;line-height:1.6}
#chapterTemplateDialog .dialog-actions{min-height:62px;margin:0;padding:12px 22px;border-top:1px solid #dbe3ec;gap:10px}
#chapterTemplateDialog .dialog-actions button{height:38px;padding:0 18px;font-size:14px}
@media(max-width:760px){#chapterTemplateDialog{width:calc(100vw - 20px);height:calc(100vh - 20px)}#chapterTemplateDialog .template-config{gap:8px}#chapterTemplateDialog .template-scope{width:100%}#chapterTemplateDialog .template-scope select{flex:1}}

/* The initialization preview is a compact chapter list, not a project classifier. */
#chapterTemplateDialog .template-preview .template-row{
  display:grid;
  grid-template-columns:150px 56px minmax(0,1fr);
  align-items:center;
  min-height:27px;
  height:27px;
  padding:0 10px;
  font-size:12px;
  line-height:27px;
}
#chapterTemplateDialog .template-preview .template-column-head{
  position:sticky;
  top:0;
  z-index:2;
  display:grid;
  grid-template-columns:150px 56px minmax(0,1fr);
  height:27px;
  padding:0 10px;
  border-bottom:1px solid #d7e3ed;
  background:#f4f8fb;
  color:#607b91;
  font-size:11px;
  font-weight:700;
  line-height:27px;
}
#chapterTemplateDialog .template-preview .template-level{
  color:#35698f;
  font-size:11px;
  font-weight:700;
  text-align:left;
  white-space:nowrap;
}
#chapterTemplateDialog .template-preview .template-row code{
  display:block;
  width:auto;
  min-width:0;
  padding:0;
  color:#56738c;
  overflow:hidden;
  text-align:left;
  text-overflow:ellipsis;
  white-space:nowrap;
}
#chapterTemplateDialog .template-preview .template-row span{
  display:block;
  min-width:0;
  padding-left:calc(min(var(--depth,0),12) * 16px);
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}
#chapterTemplateDialog .template-preview em{display:none}