/* 관리자 음계 PPT 편집 도구와 실제 예배 양식 미리보기를 배치한다. */
#scale-panel{padding:28px;max-width:1800px;margin:auto;color:var(--text,#1d1d1f)}
#scale-panel[hidden]{display:none!important}
#scale-panel *{box-sizing:border-box}
.scale-heading,.scale-actions,.scale-pagination{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap}
.scale-heading h1,.scale-heading h2{margin:0 0 8px}.scale-heading p{margin:0;color:var(--muted,#6e6e73)}
.scale-admin{color:#0674d9;font-size:13px;border:1px solid #bdd7f4;padding:8px 12px;border-radius:20px}
#scale-status{padding:14px 18px;background:var(--surface,#fff);border:1px solid var(--line,#e1e1e6);border-radius:14px;line-height:1.6}
#scale-status.error,#scale-warning.error,#scale-work-status.error{color:var(--error,#b33)}
.scale-layout{display:grid;grid-template-columns:330px minmax(0,1fr);gap:28px}.scale-layout>*,.scale-two>*{min-width:0}
.scale-card{background:var(--surface,#fff);border:1px solid var(--line,#e1e1e6);border-radius:18px;padding:20px;margin:0 0 18px;min-width:0}
.scale-card h2,.scale-card legend{font-size:18px;font-weight:700;margin:0 0 14px}.scale-card legend{padding:0 5px}
#scale-panel label{display:block;font-size:13px;font-weight:600;margin:10px 0 7px}
#scale-panel input:not([type=range]),#scale-panel select{display:block;width:100%;min-width:0;border:1px solid var(--line,#ddd);border-radius:10px;padding:10px;font:inherit;color:inherit;background:var(--surface,#fff);margin-top:7px}
#scale-panel input[type=range]{width:100%;accent-color:#0066cc}
#scale-panel button{border:1px solid transparent;border-radius:24px;padding:11px 17px;background:#0066cc;color:#fff;font:inherit;font-size:13px;font-weight:600;cursor:pointer}
#scale-panel button.secondary{background:var(--surface,#fff);border-color:#bdd7f4;color:#0066cc}
#scale-panel #scale-original[aria-pressed=true]{background:#0066cc;color:white}#scale-panel #scale-result[aria-pressed=false]{background:var(--surface,#fff);border-color:#bdd7f4;color:#0066cc}
#scale-panel button:disabled,#scale-controls:disabled{opacity:.45;cursor:default}
#scale-panel button:focus-visible,#scale-panel input:focus-visible,#scale-panel select:focus-visible{outline:3px solid #69b5ff;outline-offset:2px}
.scale-hint{font-size:12px;line-height:1.7;color:var(--muted,#6e6e73)}
#scale-file-name{font-size:12px;overflow-wrap:anywhere}.scale-two{display:grid;grid-template-columns:1fr 1fr;gap:12px}
#scale-size-value{float:right}.scale-preview-column{min-width:0}#scale-preview{margin-top:16px;min-height:200px;border-radius:16px;overflow:hidden;background:var(--surface,#fff);border:1px solid var(--line,#ddd)}
#scale-preview>p{padding:24px}#scale-preview>img{display:block;width:100%;height:auto;background:#fff}
#scale-preview .scale-stage{position:relative;container-type:inline-size;overflow:hidden;touch-action:none;width:100%}
.scale-template-layer{position:absolute;inset:0;pointer-events:none}.scale-template-layer>.worship-slide{width:100%;height:100%}
#scale-preview .scale-music{position:absolute;pointer-events:none;max-width:none}
#scale-preview .scale-glyph{position:absolute;border:0!important;border-radius:0!important;padding:0!important;display:flex;align-items:center;justify-content:center;line-height:1!important;color:#fff!important;background:transparent!important;font-family:'Malgun Gothic','맑은 고딕',sans-serif!important;font-weight:700!important;white-space:pre;touch-action:none}
#scale-preview .scale-glyph.selected{outline:1px dashed #78c0ff;background:#0066cc33!important}
.scale-pagination{justify-content:center;margin:16px 0}.scale-pagination span{font-size:13px;min-width:70px;text-align:center}
.scale-download{display:flex;align-items:end;gap:16px;margin-top:20px}.scale-download label{flex:1}.scale-download button{margin-bottom:7px;flex-shrink:0}
#scale-lyrics-list{font-size:14px;line-height:1.8;padding:12px 16px;border-left:3px solid #86bfff;white-space:pre-line}#scale-lyrics-list:empty{display:none}
[data-mode=dark] #scale-panel{--surface:#232326;--line:#404047;--text:#f5f5f7;--muted:#a4a4ad}
@media(max-width:1000px){.scale-layout{grid-template-columns:280px minmax(0,1fr);gap:16px}#scale-panel{padding:20px}}
@media(max-width:760px){.scale-layout{grid-template-columns:1fr}.scale-preview-column{grid-row:1}#scale-panel{padding:16px}.scale-download{flex-wrap:wrap}.scale-download label{flex-basis:100%}}