/* 관리 UI 색상: 스킨 디자인과 독립적으로 관리합니다. */
:root {--ui-primary:#7357cf;--ui-primary-hover:#6347bd;--ui-primary-soft:#f1edf8;--ui-background:#f8f7fb;--ui-surface:#ffffff;--ui-text:#302a38;--ui-text-muted:#80758b;--ui-border:#e5dfed;--ui-border-strong:#cfc1df;--ui-selection-border:#bba7d4;--ui-icon:#a394b5;--ui-danger:#a63e56;--ui-toast-background:#51425f;--ui-quiet-surface:#faf8fd;--ui-preview-surface:#f3f0f6;--ui-overlay:#29213180;--ui-focus-ring:#7357cf12;--ui-shadow:#35244020;--ui-accent:var(--ui-primary);--ui-accent-hover:var(--ui-primary-hover);--ui-soft:var(--ui-primary-soft);--ui-muted:var(--ui-text-muted);--ui-toast:var(--ui-toast-background);}
/* 공통 UI 및 공연 스킨 — 선택자별 한 줄 */

*{box-sizing:border-box}
body{margin:0;background:var(--ui-background);color:var(--ui-text);font:16px/1.6 'Pretendard','Apple SD Gothic Neo',sans-serif}
button,input,textarea,select{font:inherit}
button,a{cursor:pointer}
button{border:1px solid var(--ui-border);background:var(--ui-surface);color:var(--ui-text);border-radius:8px;padding:10px 18px}
button:hover{background:var(--ui-soft)}
.primary{background:var(--ui-accent);color:white;border-color:var(--ui-accent)}
.primary:hover{background:var(--ui-accent-hover)}
header{height:78px;background:var(--ui-surface);border-bottom:1px solid var(--ui-border);display:flex;align-items:center;justify-content:space-between;padding:0 5%;gap:20px}
.brand{font-size:23px;font-weight:800;letter-spacing:-1px}
.brand span{font-size:11px;font-weight:400;letter-spacing:3px;margin-left:13px}
nav{display:flex;gap:6px}
nav button{border:0;background:transparent}
nav button.active{background:var(--ui-soft);font-weight:700}
main{max-width:1260px;margin:auto;padding:42px 30px}
.eyebrow{font-size:12px;letter-spacing:3px;color:var(--ui-muted)}
h1{font-size:32px;letter-spacing:-1.3px;margin:9px 0}
p{color:var(--ui-muted)}
.topline{display:flex;justify-content:space-between;align-items:center;margin-bottom:28px}
.workspace{display:grid;grid-template-columns:230px 1fr 370px;gap:24px;align-items:start}
.panel{background:var(--ui-surface);border:1px solid var(--ui-border);border-radius:14px;padding:25px}



.hint{font-size:13px;color:var(--ui-muted);padding:15px}
.sectiontitle{font-size:20px;margin:0 0 5px}
.sub{font-size:13px;margin:0 0 24px}
label{display:block;font-size:13px;font-weight:600;margin:19px 0 7px}
input,textarea,select{width:100%;border:1px solid var(--ui-border);border-radius:7px;padding:11px 12px;background:var(--ui-surface);color:var(--ui-text)}
textarea{resize:vertical;min-height:95px}
.row{display:flex;gap:12px}
.row>*{flex:1}
.previewlabel{display:flex;justify-content:space-between;font-size:12px;color:var(--ui-muted);margin-bottom:12px}
.phone{background:var(--ui-surface);border:5px solid #39333f;border-radius:29px;overflow:hidden;box-shadow:0 14px 32px #3a2a4b10}
.phoneinner{max-height:650px;overflow:auto}
.poster{position:relative;overflow:hidden;background:#e9e9d9;min-height:420px;text-align:center;padding:43px 22px 28px;color:#2d493c}
.poster:before{content:'';position:absolute;width:300px;height:300px;border:1px solid #aeb69c;border-radius:50% 50% 0 0;left:50%;top:130px;transform:translateX(-50%)}
.poster>*{position:relative}
.poster .small{font-size:10px;letter-spacing:4px}
.poster h2{font-family:Georgia,'Noto Serif KR',serif;font-size:45px;font-weight:400;line-height:1.35;letter-spacing:-2px;margin:25px 0 5px}
.poster .eng{font:italic 20px Georgia; color:#8a957b}
.keys{height:80px;width:190px;margin:30px auto 22px;background:repeating-linear-gradient(90deg,#faf9ed 0 22px,#687864 22px 23px);border:1px solid #8c987c;transform:perspective(170px) rotateX(16deg);box-shadow:0 9px 0 #435941;position:relative}
.keys:after{content:'';position:absolute;left:16px;top:0;width:151px;height:44px;background:repeating-linear-gradient(90deg,#344e3e 0 10px,transparent 10px 24px)}
.poster .meta{font-size:12px;margin-top:20px}
.program{padding:28px 23px;background:#fffdf7}
.program h3{text-align:center;font:italic 25px Georgia;margin:0}
.program .caption{text-align:center;font-size:10px;letter-spacing:3px;color:#8a947f;margin:4px 0 22px}
.piece{display:flex;gap:13px;padding:16px 0;border-bottom:1px solid #e9e9df}
.num{font:italic 23px Georgia;color:#a2ac92;min-width:26px}
.piece b{display:block;font-size:14px}
.piece small{font-size:11px;color:#8b9083}
.piece .song{font-size:12px;margin-top:4px;color:#566249}
.invite{padding:30px 24px;text-align:center;background:#f0f1e8;font-size:13px;white-space:pre-line}
.footer{text-align:center;padding:24px;font-size:10px;letter-spacing:2px;color:#9aa28e}
.editorpiece{border:1px solid var(--ui-border);padding:15px;border-radius:10px;margin:12px 0}
.editorpiece .row{align-items:center}
.editorpiece input{margin-top:8px}
.editorpiece .row > button{flex:0;padding:5px 10px}
.badge{background:#e8efe5;color:#52704e;padding:4px 10px;border-radius:20px;font-size:12px}
.adminstats{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;margin:25px 0}
.stat strong{display:block;font:34px Georgia;margin-top:12px}
.tablewrap{overflow:auto}
table{width:100%;border-collapse:collapse;text-align:left;white-space:nowrap}
td,th{padding:20px 15px;border-bottom:1px solid #e7e9e1;font-size:14px}
th{font-size:12px;color:#858c7d}
.audience{max-width:550px;margin:auto}
.audience .poster{min-height:580px;padding-top:65px}
.audience .poster h2{font-size:65px}
.audience .keys{margin-top:65px;width:240px;height:105px}
.audience .program{padding:45px 35px}
.audience .piece{padding:22px 0}
.audience .piece b{font-size:17px}
.audience .piece .song{font-size:15px}
.audience .piece small{font-size:13px}
.toolbar{display:flex;justify-content:space-between;margin-bottom:20px;gap:10px}
.toast{position:fixed;bottom:30px;left:50%;transform:translateX(-50%);background:var(--ui-toast);color:var(--ui-surface);padding:13px 25px;border-radius:10px;z-index:9;box-shadow:0 6px 20px #0002}
.note{font-size:12px;color:var(--ui-muted);margin-top:20px}
.posterimg{width:100%;display:block}
.dark .program,.dark .invite,.dark .footer{background:#182820;color:#e4e9dd}
.dark .piece .song{color:#ced9bf}
.dark .piece{border-color:#354438}
@media(max-width:1050px){.workspace{grid-template-columns:170px 1fr}
.previewcol{grid-column:1/-1;max-width:370px;margin:auto;width:100%}
}
@media(max-width:650px){header{padding:12px 15px;height:auto;display:block}
.brand{margin-bottom:10px}
nav{justify-content:space-between}
nav button{font-size:13px;padding:8px 12px}
main{padding:25px 16px}
.workspace{display:block}


.steps .hint{display:none}
.panel{padding:20px}
.previewcol{margin:25px auto}
.topline{align-items:start;gap:12px}
h1{font-size:25px}
.adminstats{gap:8px}
.stat{padding:15px}
.stat strong{font-size:27px}
.brand span{font-size:9px}
.audience .poster h2{font-size:56px}
}


.theme-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:12px}
.theme-card{text-align:left;padding:10px}
.theme-card b{display:block;font-size:13px;margin-top:8px}
.theme-card small{font-size:10px;color:#7b8277}
.chosen{outline:0;border-color:var(--ui-accent)!important;box-shadow:0 0 0 1px var(--ui-accent)}
.mini-poster{height:125px;text-align:center;overflow:hidden;border-radius:5px;padding:15px 6px;display:flex;flex-direction:column;justify-content:center}
.mini-poster span{font-size:8px;letter-spacing:3px}
.mini-poster strong{font-size:20px;font-family:Georgia,serif}
.mini-poster i{font-size:25px}
.theme-sage{background:#e9e9d9;color:#2d493c}
.theme-ivory{background:#f8efde;color:#57432f}
.theme-midnight{background:#192b41;color:#e4c48a}
.theme-peach{background:#ffe4d6;color:#994730}
.theme-blue{background:#ecf0ff;color:#2446b1}
.poster.theme-ivory:before{border-radius:0;border:3px double #b99a70;width:85%;height:80%;top:10%}
.poster.theme-ivory .keys{display:none}
.poster.theme-ivory h2{margin:65px 0 30px}
.poster.theme-midnight:before{border-color:#bc985a;box-shadow:0 0 70px #e2c47c30}
.poster.theme-midnight .eng{color:#cbb279}
.poster.theme-peach:before{border:0;background:#f9bb9f;border-radius:50%;height:270px;top:130px}
.poster.theme-peach h2{font-family:inherit;font-weight:800}
.poster.theme-blue:before{border-radius:0;transform:translateX(-50%) rotate(-12deg);border:16px solid #c3cff8}
.poster.theme-blue h2{font-family:inherit;font-weight:900}
.palette-midnight .program{background:#f6f5f0}
.palette-midnight .num{color:#a08247}
.palette-peach .program{background:#fff9f5}
.palette-peach .part-title{color:#ae654a}
.palette-blue .program{background:#fafbff}
.palette-blue .num,.palette-blue .part-title{color:#3d5cbb}
.palette-ivory .program{background:#fffaf1}
.layout-picks,.add-buttons{display:flex;flex-wrap:wrap;gap:8px}
.layout-picks button,.add-buttons button{font-size:12px;padding:10px}
.checks{display:grid;grid-template-columns:repeat(2,1fr);gap:5px}
.checks label{display:flex;align-items:center;gap:8px;margin:6px 0;font-weight:400}
.checks input{width:17px;height:17px;accent-color:#365947}
.avatar{width:48px;height:48px;border-radius:50%;background:#eff0e5;flex-shrink:0;display:flex;align-items:center;justify-content:center;color:#8b967a;font-size:24px;overflow:hidden}
.avatar img{width:100%;height:100%;object-fit:cover}
.piece-body{min-width:0}
.student-meta{font-size:11px;color:#8b9083}
.part-title{text-align:center;padding:28px 0 14px;color:#52634a}
.part-title small{font-size:9px;letter-spacing:3px}
.part-title h4{font-size:20px;margin:5px 0}
.part-title p{font-size:12px;margin:0}
.intermission{margin:15px 0;text-align:center;padding:10px 15px;background:#ebeee7;border-radius:6px;color:#718065}
.intermission>*{display:block}
.intermission span{font-size:9px;letter-spacing:3px}
.intermission b{font-size:15px;margin:5px}
.intermission small{font-size:12px}
.layout-card .piece{border:1px solid #e6e8de;border-radius:10px;padding:20px 15px;margin:12px 0;background:#fff}
.layout-center .piece{text-align:center;flex-direction:column;align-items:center;gap:6px;padding:25px 0}
.layout-center .avatar{width:70px;height:70px}
.layout-center .num{font-size:16px}
.layout-center .song{margin:8px 0 3px}
.drag-handle{touch-action:none;cursor:grab;font-size:24px;padding:0 7px!important;background:var(--ui-soft);user-select:none}
.dragging{opacity:.55;outline:2px dashed #708c65}
.photo-upload{display:flex;gap:10px;align-items:center;margin-top:10px;flex-wrap:wrap}
.photo-upload img{width:48px;height:48px;border-radius:50%;object-fit:cover}
.photo-upload label{font-size:11px;margin:0;flex:1}
.photo-upload input{font-size:11px;padding:7px}
details{margin-top:25px;border-top:1px solid #e6e9df;padding-top:18px}
summary{cursor:pointer;font-size:13px;margin-bottom:15px}
.editorpiece .row b{font-size:13px}
.audience .avatar{width:60px;height:60px}
.audience .student-meta{font-size:13px}
.dark .intermission{background:#2a3a30;color:#d4ddcb}
.dark .layout-card .piece{background:#213329;border-color:#354438}
.dark .student-meta{color:#a6b59e}


body{background:var(--ui-background);color:var(--ui-text)}
header{border-color:var(--ui-border)}
.primary{background:var(--ui-accent);border-color:var(--ui-accent)}
.primary:hover{background:var(--ui-accent-hover)}
button{color:var(--ui-text);border-color:var(--ui-border)}
button:hover{background:var(--ui-primary-soft)}
nav button.active{background:var(--ui-primary-soft);color:#6044b4}
.chosen{outline-color:var(--ui-accent)}
.checks input{accent-color:var(--ui-primary)}
.panel{border-color:var(--ui-border)}
.eyebrow{color:#87799f}
.badge{background:#ede8f8;color:#694db7}
.dragging{outline-color:var(--ui-primary)}
.workspace{grid-template-columns:210px minmax(0,1fr) 350px}
.previewcol{position:sticky;top:20px}
.theme-sage{background:#ece7f6;color:#443556}
.mini-poster.theme-sage strong{font-size:26px;text-align:left}
.mini-poster.theme-ivory{border:4px double #b99a70}
.mini-poster.theme-midnight{background:radial-gradient(ellipse at top,#4a4a60,#161623)}
.mini-poster.theme-peach{border-radius:50% 50% 8px 8px}
.mini-poster.theme-blue{border-bottom:5px dotted #91a1db}
.skin-cover{min-height:440px;padding:30px;position:relative;overflow:hidden}
.skin-cover>*{position:relative}
.cover-sage{background:#e9e3f2;color:#3e2f4d}
.editorial-head{font-size:10px;letter-spacing:2px;border-bottom:1px solid #8e7e9d;padding-bottom:13px;display:flex;justify-content:space-between}
.editorial-title{font-size:48px;font-weight:800;line-height:1.15;letter-spacing:-2px;margin-top:30px;word-break:keep-all}
.editorial-art{height:160px;display:flex;align-items:center;justify-content:space-between}
.editorial-art span{font:150px Georgia;color:#8a6da3}
.editorial-art i{writing-mode:vertical-rl;font:italic 17px Georgia}
.editorial-bottom{font-size:11px;border-top:1px solid #8e7e9d;padding-top:15px}
.cover-ivory{background:#f9f2e5;color:#624d35;padding:22px}
.letter-frame{border:4px double #bfa684;padding:30px 20px;text-align:center;min-height:420px;font:13px/1.8 Georgia,serif}
.letter-frame small{font-size:8px;letter-spacing:2px}
.letter-flower{font-size:45px;margin:18px}
.letter-frame h2{font-size:37px;font-weight:400;line-height:1.45;margin:15px 0}
.letter-frame p{font-style:italic;color:#9a8160}
.letter-line{height:1px;width:50px;background:#bfa684;margin:22px auto}
.letter-frame b{display:block;margin-top:20px;font-weight:400}
.cover-midnight{background:#151725;color:#e8d7a9;text-align:center;padding-top:65px}
.spotlight{position:absolute!important;inset:-100px 0 auto;height:430px;background:radial-gradient(ellipse at top,#c9bdd747,transparent 70%)}
.cover-midnight small{letter-spacing:3px;font-size:9px}
.night-title{font-family:Georgia,serif;font-size:43px;line-height:1.5;margin:50px 0 25px}
.night-rule{width:30px;height:1px;background:#d2b879;margin:auto}
.cover-midnight p{font-size:9px;letter-spacing:4px;color:#ad9871}
.night-meta{font-size:12px;margin-top:42px}
.cover-peach{background:#fff1e6;color:#ad4d3a;min-height:460px}
.play-circle{position:absolute!important;width:310px;height:310px;border-radius:50%;background:#ffd2b6;right:-80px;top:90px}
.cover-peach small{font-size:12px}
.play-title{font-size:46px;font-weight:900;line-height:1.2;transform:rotate(-5deg);margin-top:38px;max-width:230px}
.play-notes{font-size:100px;line-height:1.2}
.play-notes span{position:absolute;right:0;top:-5px;font-size:65px;transform:rotate(20deg)}
.play-meta{font-size:11px;letter-spacing:1px}
.cover-blue{background:#f0f2ff;color:#2847aa;padding:0}
.ticket-top{background:#304bb1;color:#fff;padding:20px;font-size:10px;display:flex;justify-content:space-between;letter-spacing:1px}
.cover-blue h2{font-size:45px;line-height:1.25;padding:0 25px;margin-top:38px;letter-spacing:-2px}
.cover-blue p{padding:0 25px;color:#6374a6;font-size:12px}
.ticket-cut{margin:30px 0;border-top:2px dashed #9baadc}
.ticket-meta{padding:0 25px;font-size:13px}
.ticket-meta small{font-size:9px;letter-spacing:3px}
.barcode{height:45px;margin:25px;background:repeating-linear-gradient(90deg,#304bb1 0 2px,transparent 2px 5px,#304bb1 5px 6px,transparent 6px 10px)}
.skin-midnight .program,.skin-midnight .invite,.skin-midnight .memories,.skin-midnight .footer{background:#1c1e2e;color:#e8d7a9}
.skin-midnight .piece{border-color:#44404b}
.skin-midnight .piece .song{color:#ded6c6}
.skin-midnight .part-title{color:#e8d7a9}
.skin-midnight .intermission{background:#2e3042;color:#e8d7a9}
.skin-ivory .program{border:8px double #e8dcc7;font-family:Georgia,serif}
.skin-peach .program{background:#fff8f0}
.skin-peach .part-title{background:#ffdfc5;border-radius:45px 4px}
.skin-blue .program{border-left:10px solid #304bb1}
.skin-blue .piece{border-bottom:1px dashed #a8b6de}
.skin-sage .program h3{text-align:left;font:36px Georgia}
.memories{padding:32px 23px;background:#faf8fc}
.memories>small{font-size:9px;letter-spacing:3px;color:#998aa9}
.memories h3{font-size:20px;margin:8px 0 20px}
.album-grid,.album-editor{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:6px}
.album-grid button{padding:0;border:0;border-radius:5px;overflow:hidden;aspect-ratio:1;background:#e8e3ef}
.album-grid img,.album-editor img{width:100%;height:100%;object-fit:cover;display:block}
.album-editor{margin:20px 0}
.album-editor>div{aspect-ratio:1;position:relative;overflow:hidden;border-radius:6px}
.album-editor button{position:absolute;top:3px;right:3px;padding:0;width:28px;height:28px;background:var(--ui-surface);color:#463254}
.memories iframe{display:block;width:100%;aspect-ratio:16/9;border:0;border-radius:7px;margin:15px 0}
.upload-zone{display:block;padding:24px 15px;text-align:center;border:1px dashed #ab96cf;background:#f6f2fc;border-radius:9px;color:var(--ui-primary)}
.upload-zone input{margin-top:12px;font-size:13px}
.video-input{margin-bottom:15px}
.video-input>div{display:flex;gap:8px}
.video-input small{display:block;font-size:11px;margin-top:4px}
.photo-dialog,.crop-dialog{border:0;border-radius:15px;padding:22px;background:var(--ui-surface);color:var(--ui-text);width:calc(100% - 32px);max-width:440px;max-height:90dvh;overflow:auto;box-shadow:0 20px 100px #0004}
.photo-dialog::backdrop,.crop-dialog::backdrop{background:#191323b3}
.crop-dialog canvas{width:100%;display:block;aspect-ratio:1;border-radius:10px;touch-action:none;cursor:move}
.crop-dialog h3{margin:0}
.crop-dialog p{font-size:13px}
.crop-dialog input{accent-color:var(--ui-primary)}
.crop-actions{display:flex;flex-wrap:wrap;gap:8px;margin-top:20px}
.crop-actions button{flex:1;font-size:13px;white-space:nowrap}
.photo-dialog{max-width:850px}
.photo-dialog img{width:100%;display:block;max-height:75dvh;object-fit:contain}
.close-dialog{display:block;margin:0 0 12px auto}
.audience .skin-cover{min-height:580px}
.audience .editorial-title{font-size:66px}
.audience .editorial-art{height:220px}
.audience .letter-frame{min-height:520px;padding-top:55px}
.audience .letter-frame h2{font-size:50px}
.audience .night-title{font-size:58px}
.audience .play-title{font-size:65px;max-width:350px}
.audience .play-notes{font-size:145px}
.audience .cover-blue h2{font-size:65px}
.dark .skin .program,.dark .skin .invite,.dark .skin .memories,.dark .skin .footer{background:#1f1b29;color:#eee6f2}
.dark .skin .song{color:#d6c9df}
.phoneinner{max-height:750px}
@media(max-width:1050px){.workspace{grid-template-columns:170px minmax(0,1fr)}
.previewcol{position:static}
}
@media(max-width:650px){.workspace{display:block}
.previewcol{position:static}



.theme-grid{gap:9px}
.audience .skin-cover{min-height:520px}
.audience .editorial-title,.audience .play-title,.audience .cover-blue h2{font-size:52px}
.audience .night-title{font-size:48px}
input,textarea,select{font-size:16px}
.drag-handle{min-width:38px;min-height:44px}
.editorpiece .row{gap:5px}
.editorpiece .row button{min-height:40px}
nav{gap:0}
.previewlabel button{min-height:36px}
}


/* 연주 목록 · 접기와 펼치기 */
.accordion-head {display:flex;align-items:center;gap:8px;}

.accordion-toggle {display:flex;align-items:center;gap:10px;flex:1;text-align:left;border:0;min-height:48px;padding:5px;min-width:0;background:transparent;}

.accordion-toggle b {flex:1;overflow-wrap:anywhere;font-size:14px;}

.accordion-toggle span {font-size:12px;color:var(--ui-text-muted);}

.editorpiece {padding:10px 12px;}

.accordion-content {padding:0 3px 12px;}

.accordion-content textarea {white-space:pre-wrap;margin-top:8px;}

.item-tools {display:flex;gap:7px;align-items:end;flex-wrap:wrap;margin-top:15px;}

.item-tools label {flex:1;min-width:130px;margin:0;font-size:11px;}

.item-tools button {padding:9px;}

.list-summary {display:flex;align-items:center;justify-content:space-between;font-size:12px;gap:8px;margin-bottom:16px;}

.list-summary button {font-size:11px;padding:7px;}

/* 순서지 · 정보 강조 */
.performer-name {font-size:15px;font-weight:700;overflow-wrap:anywhere;}

.piece .song {white-space:pre-line;overflow-wrap:anywhere;}

.focus-song .song {font-size:15px;font-weight:700;margin:0 0 5px;}

.focus-song .performer-name {font-size:13px;font-weight:400;}

.skin-ivory .piece {text-align:center;flex-direction:column;align-items:center;}

.skin-ivory .piece .num {font-size:15px;}

.skin-peach .piece {background:#fff;border:0;border-radius:20px 5px;padding:20px 14px;margin:12px 0;}

.skin-blue .piece-body {display:flex;flex-direction:column;}

/* 공연 후 기록 */
.archive-heading {padding:38px 25px 25px;text-align:center;background:#ede8f8;color:#46365b;}

.archive-heading small {font-size:9px;letter-spacing:3px;}

.archive-heading h2 {font-size:28px;margin:12px 0;word-break:keep-all;}

.archive-heading p {font-size:12px;}

.memory-nav {display:flex;justify-content:center;gap:12px;padding:15px;background:#fff;}

.memory-nav a {color:#7357cf;text-decoration:none;border:1px solid #e0d8ef;border-radius:30px;padding:8px 17px;font-size:13px;}

.archived-program {margin:0;padding:22px;background:#fff;}

.archived-program>summary {text-align:center;}

.mode-panel {background:var(--ui-primary-soft);border-radius:10px;padding:18px;margin-bottom:25px;}

.lightbox-top,.lightbox-controls {display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:12px;}

.lightbox-controls {margin:12px 0 0;}

.photo-dialog button:disabled {opacity:.35;}

#qrpreview {max-width:230px;margin:25px auto;background:white;padding:10px;}

#qrpreview svg {width:100%;height:auto;display:block;}

.skin .performer-name {font-size:17px;}

.skin .focus-song .song {font-size:17px;}

.skin .focus-song .performer-name {font-size:14px;}

.skin-midnight .archive-heading {background:#151725;color:#e8d7a9;}

.skin-ivory .archive-heading {background:#f9f2e5;color:#624d35;}

.skin-peach .archive-heading {background:#fff1e6;color:#ad4d3a;}

.skin-blue .archive-heading {background:#f0f2ff;color:#2847aa;}

.dark .archive-heading,.dark .memory-nav,.dark .archived-program {background:#1f1b29;color:#eee6f2;}

@media(max-width:650px){.accordion-toggle {min-height:48px;}
.item-tools button {min-height:44px;}
.list-summary {flex-wrap:wrap;}
}


/* 접힌 연주 목록: 이름 강조는 곡 한 줄 말줄임, 곡 강조는 전체 표시 */
.accordion-toggle {overflow:hidden;}
.item-summary {display:flex;flex:1;min-width:0;gap:10px;align-items:center;}
.item-summary b {flex:0 0 auto;max-width:55%;font-size:14px;}
.item-summary small {flex:1;min-width:0;font-size:12px;color:var(--ui-text-muted);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.item-summary.song-first {flex-wrap:wrap;gap:4px 12px;align-items:baseline;}
.item-summary.song-first b {flex:1 1 65%;max-width:none;white-space:pre-line;overflow-wrap:anywhere;}
.item-summary.song-first small {flex:0 1 auto;white-space:normal;overflow:visible;}
/* 움직이는 드래그 카드와 배치 자리 */
.drag-ghost {position:fixed;z-index:10000;pointer-events:none;opacity:.88;background:#fff;box-shadow:0 15px 35px #49307445;border:1px solid #aa92db;transform:none;margin:0;border-radius:12px;}
.drag-ghost .accordion-head {min-height:48px;}
.drag-placeholder {background:#eee7fa;border:2px dashed #a58acb;min-height:65px;}
.drag-placeholder>* {visibility:hidden;}
.is-dragging {user-select:none;cursor:grabbing;}
.is-dragging .drag-handle {cursor:grabbing;}
/* 내 공연: 사용자의 공연 목록과 새 공연 생성 */
.concert-grid {display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:22px;}
.concert-card {background:var(--ui-surface);border:1px solid var(--ui-border);border-radius:15px;overflow:hidden;}
.concert-card-top {padding:30px 25px;min-height:210px;display:flex;flex-direction:column;justify-content:space-between;}
.concert-card-top h2 {font-size:25px;line-height:1.4;margin:15px 0;word-break:keep-all;}
.concert-card-top small,.concert-card-top span {font-size:12px;}
.concert-card-body {padding:22px;}
.concert-card-body p {font-size:13px;margin:15px 0;}
.concert-card-body>div {display:flex;gap:8px;flex-wrap:wrap;}
.concert-card-body button {font-size:12px;padding:10px 12px;}
.local-notice {background:var(--ui-primary-soft);color:#746088;padding:15px 20px;border-radius:10px;font-size:13px;margin-bottom:25px;}
.save-status {font-size:11px;color:var(--ui-text-muted);margin-left:10px;}
.create-dialog {width:calc(100% - 32px);max-width:460px;border:0;border-radius:16px;padding:30px;background:var(--ui-surface);color:var(--ui-text);}
.create-dialog::backdrop {background:#22182e88;}
.create-dialog h2 {font-size:25px;}
.create-actions {display:flex;justify-content:flex-end;gap:10px;margin-top:25px;}
@media(max-width:900px){.concert-grid {grid-template-columns:repeat(2,minmax(0,1fr));}}
@media(max-width:600px){.concert-grid {grid-template-columns:1fr;}.item-summary.name-first {gap:8px;}.item-summary b {max-width:55%;}.item-summary.song-first b {max-width:none;}.topline {flex-wrap:wrap;}.concert-card-top {min-height:170px;}}

/* 연주 목록 폭 보정: 드래그 손잡이 외의 공간은 제목 버튼에 배분합니다. */
.accordion-head {display:grid;grid-template-columns:38px minmax(0,1fr);align-items:center;gap:8px;}
.accordion-head > .drag-handle {width:38px;min-width:38px;min-height:44px;padding:0;justify-self:start;}
.accordion-head > .accordion-toggle {display:grid;grid-template-columns:26px minmax(0,1fr) 16px;align-items:center;gap:8px;width:100%;min-width:0;min-height:48px;padding:5px 0;}
.accordion-toggle > span:first-child,.accordion-toggle > span:last-child {white-space:nowrap;}
.accordion-toggle > .item-summary {width:100%;min-width:0;text-align:left;}
.accordion-toggle > .name-first {display:flex;flex-wrap:nowrap;gap:10px;}
.accordion-toggle > .name-first b {flex:0 1 auto;min-width:0;max-width:55%;white-space:normal;word-break:keep-all;overflow-wrap:anywhere;line-height:1.5;}
.accordion-toggle > .name-first small {flex:1 1 0;min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;line-height:1.5;}
.accordion-toggle > .song-first {display:flex;flex-direction:column;align-items:flex-start;gap:3px;}
.accordion-toggle > .song-first b {flex:none;max-width:100%;width:100%;white-space:pre-line;word-break:keep-all;overflow-wrap:anywhere;line-height:1.5;}
.accordion-toggle > .song-first small {flex:none;max-width:100%;white-space:normal;overflow:visible;line-height:1.5;}

/* 블루 커튼 스킨 — 포스터와 순서지, 공연 기록을 하나의 세트로 구성 */
.theme-sketch {background:#fff url('assets/blue-stage.png') center/cover no-repeat;color:#214f8b;}
.mini-poster.theme-sketch {height:180px;justify-content:flex-start;align-items:flex-start;padding:35px 12px 10px;text-align:left;}
.mini-poster.theme-sketch strong {max-width:70%;font-size:18px;}
.mini-poster.theme-sketch i {display:none;}
.skin-cover.cover-sketch {aspect-ratio:1085/1536;min-height:0;padding:0;background:#fff url('assets/blue-stage.png') center/100% 100% no-repeat;color:#204f8a;}
.sketch-copy {position:absolute;left:7%;top:22%;width:68%;}
.sketch-kicker {font-size:12px;font-weight:500;letter-spacing:1px;color:#425e80;}
.sketch-copy h2 {font-family:Georgia,'Noto Serif KR',serif;font-size:clamp(28px,9cqw,49px);font-weight:500;letter-spacing:-1.5px;line-height:1.35;margin:14px 0 18px;word-break:keep-all;overflow-wrap:anywhere;}
.sketch-accent {height:3px;width:35px;background:#efbc50;transform:rotate(-3deg);margin-bottom:17px;}
.sketch-meta {font-size:12px;line-height:1.8;color:#405976;}
.sketch-caption {position:absolute;left:7%;top:8%;font-size:8px;letter-spacing:2px;writing-mode:vertical-rl;color:#5b7592;}
.skin-sketch .invite {background:#fff;color:#49617d;font-size:13px;line-height:1.9;}
.skin-sketch .program {background:#fff;padding-top:36px;padding-bottom:36px;position:relative;}
.skin-sketch .program:before {content:'';display:block;width:52px;height:3px;background:#e8b94e;margin:0 auto 20px;transform:rotate(-2deg);}
.skin-sketch .program h3 {font-family:Georgia,serif;font-size:33px;color:#21538e;}
.skin-sketch .program .caption {color:#8290a0;letter-spacing:2px;}
.skin-sketch .piece {border-bottom:1px solid #dce5ed;padding:20px 0;}
.skin-sketch .num {color:#2c5f9c;font-style:italic;}
.skin-sketch .performer-name {color:#224c7d;}
.skin-sketch .song {color:#4a5e75;}
.skin-sketch .part-title {color:#20538f;padding-top:32px;}
.skin-sketch .part-title h4 {display:inline-block;padding:0 14px 5px;border-bottom:3px solid #f1ce7b;}
.skin-sketch .intermission {background:#f0f5fb;color:#42668f;border-radius:3px;}
.skin-sketch .memories {background:#f4f7fc;color:#244c7e;}
.skin-sketch .memories>small {color:#778eab;}
.skin-sketch .archive-heading {background:#eff4fb;color:#214f8b;border-top:5px solid #2c5f9c;}
.skin-sketch .archive-heading:after {content:'';display:block;width:35px;height:3px;margin:20px auto 0;background:#eebd55;}
.skin-sketch .memory-nav a {color:#245a99;border-color:#d7e2ef;}
.skin-sketch .footer {background:#24558e;color:#e6edf6;}
.skin-sketch .avatar {background:#eef3fa;border:2px solid #dce6f1;}


/* 공통 부제목: 빈 값은 출력하지 않습니다. */
.cover-subtitle {font-size:14px;line-height:1.6;white-space:pre-line;overflow-wrap:anywhere;}
.cover-sage .cover-subtitle {margin-top:15px;color:#755d88;}
.cover-ivory .cover-subtitle {font-style:italic;margin:10px 0 20px;color:#997e60;}
.cover-midnight .cover-subtitle {color:#d5c69f;font-style:italic;}
.cover-peach .cover-subtitle {margin:15px 0;color:#b95d45;}
.cover-blue .cover-subtitle {padding:0 25px;color:#6175ad;}
.cover-sketch .cover-subtitle {color:#5c7694;font-size:13px;margin-bottom:14px;}
/* 달빛 콘서트 — 세 줄 제목과 자유 문구를 분리한 포스터 */
.theme-moon {background:#e8ddfa url('assets/moon-concert.png') center/cover no-repeat;color:#5c3e9e;}
.mini-poster.theme-moon {height:180px;justify-content:flex-start;padding-top:25px;}
.mini-poster.theme-moon i {display:none;}
.skin-cover.cover-moon {aspect-ratio:1054/1492;min-height:0;padding:0;background:#e9e1fc url('assets/moon-concert.png') center/100% 100% no-repeat;color:#533495;}
.moon-heading {position:absolute;top:12%;left:7%;width:86%;text-align:center;}
.moon-academy {font-family:Georgia,'Noto Serif KR',serif;font-size:clamp(21px,6cqw,33px);font-weight:700;color:#9a74b3;line-height:1.45;overflow-wrap:anywhere;}
.moon-heading h2 {font-family:Georgia,'Noto Serif KR',serif;font-size:clamp(35px,11cqw,65px);font-weight:800;line-height:1.2;letter-spacing:-2px;margin:9px 0 16px;word-break:keep-all;overflow-wrap:anywhere;}
.moon-heading .cover-subtitle {font-family:Georgia,serif;font-style:italic;font-size:clamp(14px,3.8cqw,21px);line-height:1.45;color:#fff;text-shadow:0 1px 5px #7358aa35;}
.moon-bottom {position:absolute;bottom:6%;left:8%;width:84%;text-align:center;color:#765f9d;}
.moon-date {font-size:16px;line-height:1.6;overflow-wrap:anywhere;}
.moon-extra {font-size:12px;line-height:1.7;margin-top:7px;white-space:pre-line;overflow-wrap:anywhere;}
.skin-moon .invite {background:#fbf9ff;color:#7a6598;line-height:1.9;}
.skin-moon .program {background:linear-gradient(#fbf9ff,#f4f0fc);padding-top:40px;padding-bottom:40px;}
.skin-moon .program h3 {font-family:Georgia,serif;font-size:34px;color:#7451ab;}
.skin-moon .program .caption {color:#a28bb9;}
.skin-moon .piece {border-color:#e4daf1;}
.skin-moon .num {color:#b698d4;}
.skin-moon .performer-name {color:#654595;}
.skin-moon .song {color:#88749d;}
.skin-moon .part-title {color:#8864b1;}
.skin-moon .part-title h4:before,.skin-moon .part-title h4:after {content:'✧';display:inline-block;margin:0 10px;color:#c1aedb;}
.skin-moon .intermission {background:#eee7f8;color:#9b84b5;}
.skin-moon .memories {background:#f7f3fd;color:#73539b;}
.skin-moon .archive-heading {background:linear-gradient(#e7f1fc,#e9ddf8);color:#674897;}
.skin-moon .memory-nav a {color:#8865ad;border-color:#e0d4ee;}
.skin-moon .avatar {background:#eae0f6;}
.skin-moon .footer {background:#dfd4ef;color:#806798;}


/* PNG 이미지 생성 전용: 첫 비주얼과 QR만 배치 */
.print-poster {position:fixed;left:-10000px;top:0;width:550px!important;max-width:none!important;margin:0;background:#fff;z-index:-1;}
.print-poster .skin-cover {width:550px;}
.print-poster .posterimg {width:550px;height:auto;}
.print-qr-footer {display:flex;align-items:center;gap:20px;padding:25px 30px;background:#fff;color:#343042;border-top:1px solid #eee;}
.print-qr-footer img {width:108px;height:108px;flex-shrink:0;}
.print-qr-footer strong {font-size:17px;line-height:1.5;}
.print-qr-footer p {font-size:12px;color:#756c80;margin:8px 0;}
.print-qr-footer small {font-size:10px;color:#9c7a88;}
.export-preview {display:block;width:100%;max-width:320px;height:auto;margin:15px auto;border:1px solid #e6dfed;}
#downloadposter {display:block;margin:15px auto;}
#printposter:disabled,#exportposter:disabled {opacity:.6;cursor:wait;}

/* A4 PNG 출력 영역: 첫 비주얼만 2480 × 3508px로 저장하고 QR은 캔버스 위에 합성 */
.print-poster {width:550px!important;height:778px!important;overflow:hidden;}
.print-poster > .skin {position:relative;width:550px;height:778px;overflow:hidden;}
.print-poster .skin-cover {width:550px!important;height:778px!important;min-height:0!important;aspect-ratio:auto;box-sizing:border-box;}
.print-poster .posterimg {width:550px;height:778px;object-fit:contain;background:#fff;}
.print-poster .poster {height:778px;min-height:0;}
.print-poster .cover-sage .editorial-art {height:340px;}
.print-poster .cover-ivory .letter-frame {min-height:730px;padding-top:90px;}
.print-poster .cover-midnight .night-title {margin-top:110px;}
.print-poster .cover-midnight .night-meta {margin-top:100px;}
.print-poster .cover-peach .play-title {margin-top:70px;}
.print-poster .cover-peach .play-notes {font-size:200px;line-height:1.5;}
.print-poster .cover-blue h2 {margin-top:85px;}
.print-poster .cover-blue .ticket-cut {margin:70px 0;}
.print-poster .cover-blue .barcode {margin-top:65px;}
#exportposter {margin-top:15px;}
/* 공연 스킨별 순서지: 포스터와 같은 색·서체·그래픽 규칙 사용 */
.skin-sage {--program-ink:#3e2f4d;--program-secondary:#756285;--program-rule:#c8b8d6;--program-surface:#e9e3f2;}
.skin-ivory {--program-ink:#624d35;--program-secondary:#90785a;--program-rule:#d4bf9f;--program-surface:#f9f2e5;}
.skin-midnight {--program-ink:#e8d7a9;--program-secondary:#b8aa8c;--program-rule:#5b5260;--program-surface:#151725;}
.skin-peach {--program-ink:#ad4d3a;--program-secondary:#ad735e;--program-rule:#f1c4ac;--program-surface:#fff1e6;}
.skin-blue {--program-ink:#2847aa;--program-secondary:#6577ad;--program-rule:#a8b6de;--program-surface:#f0f2ff;}
.skin-sketch {--program-ink:#214f8b;--program-secondary:#667b94;--program-rule:#c8d7e5;--program-surface:#fff;}
.skin-moon {--program-ink:#674897;--program-secondary:#9176ac;--program-rule:#dfd1ed;--program-surface:#f5effc;}
.skin .program {color:var(--program-ink);background:var(--program-surface);border-left:0;}
.skin .program .performer-name,.skin .program h3,.skin .program .part-title {color:var(--program-ink);}
.skin .program .song,.skin .program .student-meta,.skin .program .caption {color:var(--program-secondary);}
.skin .program .piece {border-color:var(--program-rule);}
.skin .program .num {color:var(--program-ink);}
.skin .program .part-title p {color:var(--program-secondary);}
/* 에디토리얼: 잡지처럼 왼쪽 정렬한 큰 제목과 선 */
.skin-sage .invite {background:#e9e3f2;color:#756285;text-align:left;padding-left:35px;}
.skin-sage .program {padding-top:10px;}
.skin-sage .program h3 {text-align:left;font:42px/1.2 Georgia,serif;letter-spacing:-2px;border-top:1px solid #8e7e9d;padding-top:25px;}
.skin-sage .program .caption {text-align:left;letter-spacing:2px;margin:10px 0 30px;}
.skin-sage .program .piece {gap:18px;padding:25px 0;}
.skin-sage .program .num {font-family:Georgia,serif;font-size:30px;font-style:normal;}
.skin-sage .program .part-title {text-align:left;border-bottom:1px solid #8e7e9d;margin-bottom:10px;}
.skin-sage .intermission {background:#ddd3e9;color:#695377;border-radius:0;text-align:left;}
.skin-sage .memories,.skin-sage .footer {background:#e9e3f2;color:#756285;}
/* 클래식 레터: 크림색 편지지와 세리프, 중앙 정렬 */
.skin-ivory .invite {background:#f9f2e5;color:#90785a;font-family:Georgia,serif;}
.skin-ivory .program {border:0;padding-top:22px;}
.skin-ivory .program h3 {font-family:Georgia,serif;font-size:34px;font-weight:400;letter-spacing:1px;}
.skin-ivory .program:before,.skin-ivory .program:after {content:'';display:block;border-top:3px double #bfa684;width:75%;margin:0 auto 25px;}
.skin-ivory .program:after {margin:25px auto 0;}
.skin-ivory .program .piece {border-bottom:0;gap:7px;padding:22px 0;font-family:Georgia,serif;}
.skin-ivory .program .num {font-size:13px;letter-spacing:2px;color:#b49b77;}
.skin-ivory .intermission {background:transparent;border-top:1px solid #d4bf9f;border-bottom:1px solid #d4bf9f;border-radius:0;color:#90785a;}
.skin-ivory .memories,.skin-ivory .footer {background:#f9f2e5;color:#90785a;}
/* 나이트 스테이지: 어두운 무대와 금빛 헤드라인 */
.skin-midnight .invite {background:#151725;color:#b8aa8c;font-family:Georgia,serif;}
.skin-midnight .program {padding-top:24px;padding-bottom:45px;}
.skin-midnight .program h3 {font:32px/1.4 Georgia,serif;letter-spacing:3px;}
.skin-midnight .program .caption {letter-spacing:4px;margin-top:10px;}
.skin-midnight .program .piece {padding:26px 0;gap:20px;}
.skin-midnight .program .num {font-family:Georgia,serif;font-size:27px;}
.skin-midnight .program .part-title h4 {font-family:Georgia,serif;font-weight:400;letter-spacing:2px;}
.skin-midnight .intermission {background:#202235;border-top:1px solid #685b40;border-bottom:1px solid #685b40;color:#b8aa8c;border-radius:0;}
.skin-midnight .memories,.skin-midnight .footer {background:#151725;color:#b8aa8c;}
/* 플레이 멜로디: 살구색과 둥근 그래픽 카드 */
.skin-peach .invite {background:#fff1e6;color:#ad735e;}
.skin-peach .program h3 {font-family:inherit;font-size:34px;font-style:normal;font-weight:900;letter-spacing:-1px;}
.skin-peach .program .piece {background:#ffe4d1;border-radius:28px 8px 28px 8px;padding:23px 18px;gap:15px;}
.skin-peach .program .num {background:#fff1e6;border-radius:50%;min-width:35px;height:35px;text-align:center;font-size:20px;line-height:35px;font-style:normal;}
.skin-peach .program .part-title {background:transparent;padding:30px 0 15px;text-align:left;}
.skin-peach .program .part-title h4 {font-size:23px;font-weight:800;}
.skin-peach .intermission {background:#ffdfc5;color:#ad735e;border-radius:30px;}
.skin-peach .memories,.skin-peach .footer {background:#fff1e6;color:#ad735e;}
/* 모던 티켓: 코발트색 띠와 점선, 티켓 번호 */
.skin-blue .invite {background:#f0f2ff;color:#6577ad;}
.skin-blue .program {padding-top:0;border:0;}
.skin-blue .program h3 {background:#304bb1;color:#fff;padding:16px;font-family:inherit;font-size:27px;font-style:normal;font-weight:800;text-transform:uppercase;letter-spacing:4px;}
.skin-blue .program .caption {margin:15px 0 25px;letter-spacing:3px;}
.skin-blue .program .piece {padding:25px 0;border-bottom:2px dashed #a8b6de;gap:17px;}
.skin-blue .program .num {background:#304bb1;color:#fff;font-family:inherit;font-size:14px;font-style:normal;min-width:30px;height:30px;text-align:center;line-height:30px;}
.skin-blue .program .part-title {text-align:left;border-bottom:2px solid #304bb1;margin-bottom:10px;}
.skin-blue .intermission {background:transparent;border:2px dashed #a8b6de;color:#6577ad;border-radius:0;}
.skin-blue .memories,.skin-blue .footer {background:#f0f2ff;color:#6577ad;}
/* 블루 커튼: 잉크색 세리프와 연필선, 조명의 노랑 */
.skin-sketch .program h3 {font-size:35px;letter-spacing:-1px;}
.skin-sketch .program .piece {padding:25px 0;border-bottom:1px solid #b6c7da;gap:18px;}
.skin-sketch .program .num {font-family:Georgia,serif;font-size:26px;}
.skin-sketch .program .part-title h4 {border-bottom:3px solid #edc260;font-family:Georgia,serif;font-weight:500;}
.skin-sketch .program .caption {letter-spacing:3px;}
/* 달빛 콘서트: 은은한 별과 구름색 바탕, 보랏빛 세리프 */
.skin-moon .program {background:radial-gradient(ellipse at 20% 10%,#fff 0,transparent 50%),linear-gradient(#fbf9ff,#ece3fa);padding-top:35px;}
.skin-moon .program h3 {font:italic 35px/1.4 Georgia,serif;}
.skin-moon .program h3:before,.skin-moon .program h3:after {content:'✧';font-size:19px;margin:0 12px;color:#bea6d8;}
.skin-moon .program .piece {border-bottom:1px solid #ddd0ed;padding:25px 0;gap:17px;}
.skin-moon .program .num {font-family:Georgia,serif;font-size:25px;color:#b79bd1;}
.skin-moon .intermission {background:#e9e0f5;color:#9176ac;border-radius:30px;}
.dark .skin .program {--program-ink:#eee6f2;--program-secondary:#cbbcd5;--program-rule:#4b4054;--program-surface:#1f1b29;background:#1f1b29;}
.dark .skin .program .piece {background:transparent;}

/* 연주 순서 샘플 입력 */
.sample-actions {display:flex;gap:6px;flex-wrap:wrap;}
.sample-actions button {font-size:12px;padding:8px 11px;}
#sample20 {background:#ede8f8;color:#694bb5;border-color:#d9ccef;}

/* 順서지 배치 카드: 모바일에서도 세 가지를 한 줄에 표시 */
.density-picker {display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;margin:10px 0 23px;}
.density-option {min-width:0;height:84px;padding:9px 11px;text-align:left;border:1px solid #dfd7e9;background:var(--ui-surface);border-radius:9px;}
.density-option[aria-pressed="true"] {border-color:var(--ui-primary);background:#f5f0fc;box-shadow:inset 0 0 0 1px var(--ui-primary);}
.density-diagram {display:flex;flex-direction:column;justify-content:center;height:39px;max-width:84px;margin:0 0 7px;}
.diagram-row {display:flex;flex-direction:column;gap:3px;}
.diagram-row i {display:block;width:36%;height:3px;background:#b8a5d0;border-radius:2px;}
.diagram-row i+i {width:80%;height:2px;background:#d8cce6;}
.diagram-spacious {gap:12px;}
.diagram-normal {gap:6px;}
.diagram-compact {gap:6px;}
.diagram-compact .diagram-row {flex-direction:row;align-items:center;gap:5px;}
.diagram-compact .diagram-row i {width:24%;height:3px;}
.diagram-compact .diagram-row i+i {width:60%;height:2px;}
.density-label {display:flex;align-items:center;justify-content:space-between;gap:4px;font-size:13px;}
.density-check {width:15px;height:15px;border:1px solid #d7cbe4;border-radius:50%;font-size:10px;line-height:13px;text-align:center;color:transparent;}
.density-option[aria-pressed="true"] .density-check {background:var(--ui-accent);border-color:var(--ui-accent);color:var(--ui-surface);}
/* 넓게: 같은 스킨을 유지하면서 사진·간격·두 줄 배치를 여유롭게 */
.skin .program.density-spacious .piece {padding:25px 0;gap:18px;align-items:flex-start;}
.skin .program.density-spacious .piece-body {display:flex;flex-direction:column;gap:4px;flex:1;}
.skin .program.density-spacious .performer-name {font-size:20px;line-height:1.6;}
.skin .program.density-spacious .song {font-size:17px;line-height:1.7;margin:0;}
.skin .program.density-spacious .focus-song .song {font-size:20px;}
.skin .program.density-spacious .focus-song .performer-name {font-size:17px;}
.skin .program.density-spacious .avatar {width:72px;height:72px;}
.skin .program.density-spacious .student-meta {font-size:13px;line-height:1.6;}
.skin-peach .program.density-spacious .piece {padding:23px 20px;}
/* 기본: 스킨의 기존 두 줄 배치와 적당한 간격 사용 */
.skin .program.density-normal .piece-body {display:flex;flex-direction:column;}
/* 좁게: 글자를 숨기지 않고 이름·곡을 같은 줄에 배치 */
.skin .program.density-compact {padding:25px 20px;}
.skin .program.density-compact .piece {display:flex;flex-direction:row;align-items:flex-start;gap:9px;padding:9px 0;margin:0;border-radius:0;}
.skin .program.density-compact .piece-body {display:grid;grid-template-columns:minmax(0,1fr) minmax(0,3fr);align-items:baseline;column-gap:12px;row-gap:3px;flex:1;min-width:0;text-align:left;}
.skin .program.density-compact .focus-song .piece-body {grid-template-columns:minmax(0,3fr) minmax(0,1fr);}
.skin .program.density-compact .performer-name,.skin .program.density-compact .song {font-size:14px;line-height:1.6;margin:0;white-space:pre-line;word-break:keep-all;overflow-wrap:anywhere;}
.skin .program.density-compact .performer-name {font-weight:600;}
.skin .program.density-compact .focus-song .performer-name {font-weight:400;font-size:13px;}
.skin .program.density-compact .focus-song .song {font-weight:600;}
.skin .program.density-compact .student-meta {grid-column:2;grid-row:2;font-size:11px;line-height:1.5;}
.skin .program.density-compact .avatar {width:30px;height:30px;min-width:30px;}
.skin .program.density-compact .num {min-width:20px;width:auto;height:auto;font-size:12px;line-height:22px;}
.skin .program.density-compact .part-title {padding:20px 0 9px;}
.skin .program.density-compact .part-title h4 {font-size:17px;}
.skin .program.density-compact .intermission {padding:8px 12px;margin:12px 0;}
.skin-ivory .program.density-compact .piece {border-bottom:1px solid var(--program-rule);}
.skin-peach .program.density-compact .piece {background:transparent;border-bottom:1px solid var(--program-rule);}
@media(max-width:400px){.density-picker {gap:6px;}.density-option {height:78px;padding:8px;}.density-diagram {height:34px;}.density-label {font-size:12px;}.skin .program.density-compact {padding-left:16px;padding-right:16px;}}

/* 공연명에 입력한 줄바꿈은 화면과 인쇄 이미지에 동일하게 적용 */
.skin-cover h2,.skin-cover .editorial-title,.skin-cover .night-title,.skin-cover .play-title,.archive-heading h2,.concert-card-top h2 {white-space:pre-line;}

/* 모든 스킨·배치: 연주 항목 사이 구분선 제거 */
.skin .program .piece,.skin .program[class*="density-"] .piece {border:0;}
/* 좁게: 추가 정보는 곡명이 있는 열의 두 번째 줄에 정렬 */
.skin .program.density-compact .performer-name {grid-column:1;grid-row:1;}
.skin .program.density-compact .song {grid-column:2;grid-row:1;}
.skin .program.density-compact .focus-song .song {grid-column:1;grid-row:1;}
.skin .program.density-compact .focus-song .performer-name {grid-column:2;grid-row:1;}
.skin .program.density-compact .focus-song .student-meta {grid-column:1;grid-row:2;}

/* 인쇄용 순서지 — 화면과 독립적인 A4 배치 */
.print-dialog {width:min(960px,96vw);max-width:96vw;max-height:94vh;padding:20px;background:#f3f0f6;border:0;border-radius:14px;color:#302a37;}
.print-dialog::backdrop {background:#211b2a99;}
.paper-controls {display:flex;align-items:center;justify-content:space-between;gap:12px;position:sticky;top:-20px;background:var(--ui-preview-surface);padding:12px 0;z-index:2;flex-wrap:wrap;}
.paper-controls>div {display:flex;align-items:center;gap:10px;flex-wrap:wrap;}
.paper-controls #paper-count {font-size:13px;color:#74677f;}
.paper-preview-list {display:grid;gap:20px;width:100%;}
.paper-preview-slot {width:100%;max-width:794px;margin:0 auto;overflow:hidden;box-shadow:0 3px 16px #30204016;background:#fff;}
.paper-staging {position:absolute;left:-10000px;top:0;width:794px;pointer-events:none;}
.paper-sheet {width:794px;height:1123px;padding:48px 48px 32px;background:#fff;color:#29252e;display:flex;flex-direction:column;gap:22px;font:15px/1.6 'Pretendard','Apple SD Gothic Neo',sans-serif;box-sizing:border-box;transform-origin:top left;overflow:hidden;}
.paper-sheet * {box-sizing:border-box;}
.paper-header {flex:none;border-bottom:2px solid var(--paper-accent);padding-bottom:18px;white-space:pre-line;overflow-wrap:anywhere;}
.paper-header>small {font-size:13px;color:var(--paper-accent);}
.paper-header>h1 {font-size:30px;line-height:1.3;letter-spacing:-1px;margin:5px 0 8px;color:var(--paper-accent);}
.paper-header>p {font-size:13px;margin:4px 0;}
.paper-header>div {font-size:11px;color:#6d6673;margin-top:10px;}
.paper-columns {flex:1;min-height:0;display:grid;grid-template-columns:1fr;gap:30px;}
.paper-columns-2 .paper-columns {grid-template-columns:1fr 1fr;}
.paper-column {min-width:0;min-height:0;overflow:hidden;}
.paper-block {display:flow-root;}
.paper-piece {display:flex;align-items:flex-start;gap:10px;padding:11px 0;break-inside:avoid;}
.paper-piece-body {min-width:0;flex:1;white-space:pre-line;overflow-wrap:anywhere;}
.paper-name {font-size:15px;display:block;}
.paper-song {font-size:14px;}
.paper-piece-body>small {display:block;font-size:11px;color:#756c7c;margin-top:2px;}
.paper-number {font-size:11px;color:var(--paper-accent);min-width:20px;padding-top:3px;}
.paper-avatar {width:36px;height:36px;object-fit:cover;border-radius:50%;flex:none;}
.paper-part {padding:12px 0 5px;color:var(--paper-accent);}
.paper-part>h3 {font-size:18px;margin:0;}
.paper-part>p {font-size:12px;margin:2px 0;white-space:pre-line;}
.paper-break {padding:8px 12px;margin:10px 0;background:#f5f2f7;color:var(--paper-accent);text-align:center;white-space:pre-line;}
.paper-break>span {display:block;font-size:9px;letter-spacing:2px;}
.paper-break>b {display:block;font-size:13px;}
.paper-break>small {display:block;font-size:11px;}
.paper-footer {flex:none;display:flex;justify-content:space-between;font-size:10px;letter-spacing:1px;color:#877c90;}
.paper-spacious .paper-piece {padding:16px 0;}
.paper-spacious .paper-name {font-size:17px;}
.paper-spacious .paper-song {font-size:15px;}
.paper-compact .paper-piece {padding:5px 0;}
.paper-compact .paper-piece-body {display:flex;flex-wrap:wrap;column-gap:12px;align-items:baseline;}
.paper-compact .paper-name {font-size:13px;}
.paper-compact .paper-song {font-size:12px;flex:1;min-width:70px;}
.paper-compact .paper-piece-body>small {width:100%;}
@media(max-width:600px){.print-dialog {padding:12px;}.paper-controls {top:-12px;}.paper-controls button {font-size:12px;padding:8px 10px;}}

.workspace.workspace-print {grid-template-columns:210px minmax(0,1fr);}
@media(max-width:1050px){.workspace.workspace-print {grid-template-columns:170px minmax(0,1fr);}}
@media(max-width:650px){.workspace.workspace-print {display:block;}}

/* 모바일 스킨과 독립적인 인쇄 전용 템플릿 */
.print-template-picker {display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;}
.print-template-card {display:flex;flex-direction:column;align-items:flex-start;gap:9px;text-align:left;padding:18px;}
.print-template-card>small {font-size:12px;line-height:1.6;color:#7d6e89;}
.print-template-card.chosen {border-color:#9679b3;background:#f6f0fc;box-shadow:0 0 0 1px #9679b3;}
.print-template-diagram {display:flex;gap:14px;padding:9px;border:1px solid #c5b8d1;background:var(--ui-surface);width:43px;height:60px;}
.print-template-diagram.folded {width:86px;height:60px;background:linear-gradient(90deg,var(--ui-surface) 49.3%,#ddd1eb 49.3%,#ddd1eb 50.7%,var(--ui-surface) 50.7%);}
.print-template-diagram>i {flex:1;background:repeating-linear-gradient(to bottom,#bfaed2 0px,#bfaed2 2px,transparent 2px,transparent 7px);}
.paper-template-portrait .paper-header {border-bottom:1px solid #b8acbc;text-align:left;}
.paper-template-folded {width:1123px;height:794px;padding:35px 45px 25px;gap:16px;}
.paper-template-folded .paper-header {text-align:center;border-bottom:0;padding-bottom:6px;}
.paper-template-folded .paper-header>h1 {font-family:Georgia,'Batang',serif;font-size:26px;font-weight:600;}
.paper-template-folded .paper-header>small {font-size:12px;}
.paper-template-folded .paper-columns {gap:70px;}
.paper-template-folded .paper-part {padding:8px 0;color:var(--paper-accent);}
.paper-template-folded .paper-part>h3 {display:inline-block;background:#eee8f6;border-radius:24px;padding:3px 18px;font-size:15px;}
.paper-template-folded .paper-piece-body {display:grid;grid-template-columns:minmax(65px,auto) minmax(0,1fr);column-gap:15px;align-items:baseline;}
.paper-template-folded .paper-name {grid-column:1;grid-row:1;font-size:14px;font-weight:400;}
.paper-template-folded .paper-song {grid-column:2;grid-row:1;font-size:14px;}
.paper-template-folded .paper-piece-body>small {grid-column:2;grid-row:2;}
.paper-template-folded.paper-focus-song .paper-song {grid-column:1;font-weight:600;}
.paper-template-folded.paper-focus-song .paper-name {grid-column:2;}
.paper-template-folded.paper-focus-song .paper-piece-body {grid-template-columns:minmax(0,3fr) minmax(65px,1fr);}
.paper-template-folded.paper-focus-song .paper-piece-body>small {grid-column:1;}
.paper-template-folded.paper-spacious .paper-piece {padding:12px 0;}
.paper-template-folded.paper-compact .paper-piece {padding:4px 0;}
.paper-template-folded.paper-compact .paper-song,.paper-template-folded.paper-compact .paper-name {font-size:12px;}
@media(max-width:500px){.print-template-picker {grid-template-columns:1fr;}.print-template-card {padding:14px;}}

/* 순서 이동은 접힌 목록 왼쪽에서, 편집 열기는 오른쪽 글자로 표시 */
.accordion-head {grid-template-columns:72px minmax(0,1fr);gap:7px;}
.accordion-head>.accordion-toggle {grid-template-columns:24px minmax(0,1fr) 30px;gap:6px;}

.preview-save {margin-top:14px;padding:15px;background:var(--ui-surface);border:1px solid var(--ui-border);border-radius:12px;text-align:center;}
.preview-save>button {display:block;width:100%;font-size:14px;}
.preview-save>p {font-size:12px;line-height:1.6;margin:10px 0 4px;color:#6c587c;}
.preview-save>small {display:block;font-size:10px;line-height:1.6;color:#92869b;}

/* 블록 어디서나 클릭/드래그, 클릭으로 펼침 여부를 표시하는 꺾쇠 */
.accordion-head {grid-template-columns:34px minmax(0,1fr);gap:8px;}
.accordion-head>.drag-handle {width:34px;min-width:34px;min-height:44px;}
.accordion-head>.accordion-toggle {grid-template-columns:24px minmax(0,1fr) 18px;}
.accordion-toggle>.expand-chevron {display:block;justify-self:center;width:8px;height:8px;border-right:1.5px solid currentColor;border-bottom:1.5px solid currentColor;transform:rotate(45deg);margin-top:-4px;}
.accordion-toggle[aria-expanded="true"]>.expand-chevron {transform:rotate(225deg);margin-top:4px;}
.editorpiece {cursor:grab;-webkit-touch-callout:none;}
.editorpiece input,.editorpiece textarea {cursor:text;}
.editorpiece label,.editorpiece select {cursor:default;}
.accordion-head,.accordion-toggle {user-select:none;-webkit-user-select:none;}
.accordion-toggle {cursor:grab;}

/* 기록 모드의 순서지는 일반 모드와 같은 가로 폭을 사용합니다. */
.skin>.archived-program {display:block;width:100%;max-width:none;min-width:0;margin:0;padding:0;border:0;background:var(--program-surface);color:var(--program-ink);}
.skin>.archived-program>summary {padding:18px 20px;text-align:center;cursor:pointer;font-size:14px;}
.skin>.archived-program>.program {width:100%;max-width:none;min-width:0;margin:0;}
.saved-view-note {margin:0;padding:10px 16px;background:var(--ui-primary-soft);color:#7e6b8f;font-size:11px;text-align:center;}
.preview-save>[data-save-status] {display:block;margin-bottom:9px;font-size:12px;}
.media-visibility-note {padding:12px 14px;border-radius:8px;background:#f7f3fb;color:#796586;font-size:12px;line-height:1.7;}
.optional-piece-fields {margin-top:15px;padding-top:12px;border-top:1px solid #eee7f3;}
.optional-piece-fields>summary {cursor:pointer;font-size:13px;color:#826d94;}
.share-save-box {padding:16px;background:var(--ui-primary-soft);border-radius:10px;margin-bottom:24px;}

.dark .skin>.archived-program {background:#1f1b29;color:#eee6f2;}

/* 작은 조작 요소의 모양·상태·색상 통일 */
button {transition:background-color .15s,border-color .15s,box-shadow .15s;}
button:focus-visible,a:focus-visible,summary:focus-visible {outline:2px solid var(--ui-accent);outline-offset:3px;}
input:focus,textarea:focus,select:focus {outline:0;border-color:#a08acb;box-shadow:0 0 0 3px var(--ui-focus-ring);}
button:disabled {cursor:default;opacity:.55;}
.panel {box-shadow:0 3px 15px #3a2a4b03;}
.editorpiece {border-color:var(--ui-border);border-radius:10px;transition:border-color .15s;}
.editorpiece:hover {border-color:var(--ui-border-strong);}
.editorpiece.expanded {border-color:var(--ui-selection-border);box-shadow:0 2px 10px #51356f06;}
.accordion-head>.drag-handle {display:flex;align-items:center;justify-content:center;background:transparent;color:var(--ui-icon);border-color:transparent;border-radius:7px;}
.accordion-head>.drag-handle:hover {background:var(--ui-soft);color:var(--ui-accent);border-color:#e2d9ee;}
.drag-grip {display:block;flex:none;pointer-events:none;}
.accordion-toggle>.expand-chevron {color:var(--ui-icon);}
.toast {display:flex;align-items:center;gap:10px;background:var(--ui-toast);bottom:calc(24px + env(safe-area-inset-bottom));max-width:calc(100vw - 32px);width:max-content;padding:13px 18px;border:1px solid #ffffff14;border-radius:11px;font-size:13px;line-height:1.6;z-index:10050;box-shadow:0 8px 28px var(--ui-shadow);}
.toast-dot {width:6px;height:6px;flex:none;border-radius:50%;background:#d3bdee;}
.skin.without-intro>.program[class*="density-"] {padding-top:56px;}
.concert-card-body>div {display:flex;gap:7px;flex-wrap:wrap;}
.copy-concert-button {font-size:12px;color:#81728f;background:#faf8fd;}
.mobile-preview-launch {display:none;}
.mobile-preview-dialog {padding:0;border:1px solid var(--ui-border);border-radius:18px;width:min(550px,96vw);max-width:96vw;max-height:92dvh;background:var(--ui-surface);color:var(--ui-text);}
.mobile-preview-dialog::backdrop {background:var(--ui-overlay);}
.mobile-preview-bar {position:sticky;top:0;display:flex;align-items:center;justify-content:space-between;gap:12px;padding:12px 16px;background:#fffffff5;z-index:2;border-bottom:1px solid var(--ui-border);}
.mobile-preview-bar>b {font-size:13px;}
.mobile-preview-bar>button {padding:7px 13px;font-size:12px;}
.mobile-preview-content {width:100%;overflow-x:hidden;}
.mobile-preview-save {padding:16px;text-align:center;background:var(--ui-quiet-surface);border-top:1px solid var(--ui-border);}
.mobile-preview-save>p {font-size:12px;margin:0 0 10px;}
.mobile-preview-save>button {width:100%;}
.mobile-preview-save>.save-status {display:block;margin-top:8px;}
@media(max-width:1050px){body:has(.mobile-preview-launch) main {padding-bottom:100px;}.mobile-preview-launch {position:fixed;right:18px;bottom:calc(18px + env(safe-area-inset-bottom));display:flex;align-items:center;gap:8px;min-height:46px;padding:11px 18px;background:var(--ui-accent);color:var(--ui-surface);border-color:var(--ui-accent);border-radius:28px;box-shadow:0 5px 18px #7357cf25;z-index:5;font-size:13px;}.mobile-preview-launch:hover {background:var(--ui-accent-hover);}.toast {bottom:calc(80px + env(safe-area-inset-bottom));}}
@media(prefers-reduced-motion:reduce){button,.editorpiece {transition:none;}}

/* 디자인 선택: A4 세로 비율, 이미지 전용 3열 카드 */
.theme-grid {grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;}
.theme-grid>.theme-card {position:relative;display:block;width:100%;min-width:0;padding:0;aspect-ratio:210/297;overflow:hidden;border:1px solid var(--ui-border);border-radius:8px;background:var(--ui-quiet-surface);}
.theme-card>img {display:block;width:100%;height:100%;object-fit:cover;}
.theme-card>.theme-selected-mark {display:none;position:absolute;right:6px;top:6px;width:19px;height:19px;align-items:center;justify-content:center;border-radius:50%;background:var(--ui-accent);color:var(--ui-surface);box-shadow:0 1px 4px #36234420;}
.theme-card[aria-pressed="true"]>.theme-selected-mark {display:flex;}
@media(max-width:400px){.theme-grid {gap:7px;}}

/* 햇살 피아노: 원본 사진 위에 수정 가능한 제목과 공연 정보를 표시 */
.theme-sunlight {background:#f7ead6 url('assets/sunlight-piano.png') center/cover no-repeat;color:#60472e;}
.skin-cover.cover-sunlight {aspect-ratio:210/297;min-height:0;padding:0;background:#f7ead6 url('assets/sunlight-piano.png') center/cover no-repeat;color:#60472e;}
.sunlight-heading {position:relative;padding:11% 8% 15%;text-align:center;background:linear-gradient(#fff7eb60,#fff7eb25,transparent);}
.sunlight-academy {font-size:13px;letter-spacing:1px;font-weight:500;}
.sunlight-heading>h2 {font-family:'Batang','Noto Serif KR',Georgia,serif;font-size:36px;line-height:1.3;letter-spacing:-1.4px;font-weight:600;margin:12px 0;white-space:pre-line;word-break:keep-all;overflow-wrap:anywhere;}
.sunlight-heading>.cover-subtitle {font-family:Georgia,'Batang',serif;font-size:12px;line-height:1.6;color:#846b4e;white-space:pre-line;}
.sunlight-meta {font-size:11px;line-height:1.8;margin-top:17px;white-space:pre-line;}
.skin-sunlight {--program-ink:#60472e;--program-secondary:#947757;--program-rule:#d8c3a5;--program-surface:#fffaf2;}
.skin-sunlight .program {background:#fffaf2;padding-top:38px;padding-bottom:38px;}
.skin-sunlight .program h3 {font:italic 34px/1.3 Georgia,serif;color:#7b5d3d;}
.skin-sunlight .program .caption {letter-spacing:2px;color:#a28b70;margin-top:10px;}
.skin-sunlight .program .piece {padding:23px 0;gap:16px;}
.skin-sunlight .program .num {font-family:Georgia,serif;font-size:24px;color:#b69770;}
.skin-sunlight .part-title {border:0;padding:25px 0 12px;}
.skin-sunlight .part-title h4 {font-family:'Batang',Georgia,serif;font-size:22px;font-weight:500;}
.skin-sunlight .intermission {background:#f3e8d7;color:#947757;border-radius:4px;}
.skin-sunlight .invite {background:#fcf4e7;color:#80674b;font-family:'Batang',Georgia,serif;}
.skin-sunlight .memories {background:#fffaf2;}
.skin-sunlight .memories h3 {font-family:'Batang',Georgia,serif;color:#7b5d3d;}
.skin-sunlight .memories>small {color:#b69770;}
.skin-sunlight .footer {background:#fcf4e7;color:#a28b70;}
.skin-sunlight .memory-nav {background:#fffaf2;}
.skin-sunlight .memory-nav a {color:#947757;border-color:#e4d5c0;}

/* 05는 공유만, 06은 설정 옆에 실제 출력 비율 미리보기를 표시 */
.workspace.workspace-share {grid-template-columns:210px minmax(0,1fr);}
.workspace.workspace-output {grid-template-columns:180px minmax(260px,1fr) minmax(330px,1.3fr);gap:20px;}
.download-tabs {display:grid;grid-template-columns:1fr 1fr;gap:9px;margin:4px 0 24px;}
.download-tabs>button {font-size:14px;}
.download-tabs>[aria-pressed="true"] {background:var(--ui-primary-soft);color:var(--ui-primary);}
.output-preview-panel {min-width:0;padding:18px;background:var(--ui-preview-surface);}
.output-preview-heading {display:flex;flex-wrap:wrap;justify-content:space-between;gap:6px;margin-bottom:16px;}
.output-preview-heading>b {font-size:14px;}
.output-preview-heading>small {font-size:11px;color:var(--ui-text-muted);}
.cover-preview-frame {position:relative;width:100%;max-width:550px;margin:0 auto;overflow:hidden;background:var(--ui-surface);box-shadow:0 3px 16px var(--ui-shadow);}
.cover-preview-sheet {position:relative;width:550px;height:778px;transform-origin:top left;overflow:hidden;}
.cover-preview-sheet>.skin {position:relative;width:550px;height:778px;overflow:hidden;}
.cover-preview-sheet .skin-cover,.cover-preview-sheet .posterimg {width:550px;}
.cover-preview-qr {position:absolute;width:70.97px;height:70.97px;line-height:0;background:#fff;}
.cover-preview-qr>svg {display:block;width:100%;height:100%;}
.cover-preview-qr.qr-top-left {left:18.85px;top:18.85px;}
.cover-preview-qr.qr-top-right {right:18.85px;top:18.85px;}
.cover-preview-qr.qr-bottom-left {left:18.85px;bottom:18.85px;}
.cover-preview-qr.qr-bottom-right {right:18.85px;bottom:18.85px;}
.cover-export-image {display:block;width:100%;height:auto;}
.output-download {width:100%;margin-top:12px;}
#exportresult {font-size:12px;color:var(--ui-text-muted);margin-top:12px;}
.inline-print-preview {min-width:0;}
.inline-print-preview>.paper-controls {position:static;background:transparent;padding:0;display:flex;gap:12px;margin-bottom:14px;}
.inline-print-preview .paper-controls>div {width:100%;display:flex;flex-wrap:wrap;gap:8px;}
.inline-print-preview #downloadprogram {width:100%;background:var(--ui-primary);border-color:var(--ui-primary);color:var(--ui-surface);font-size:13px;}
.inline-print-preview>.note {margin:12px 0;}
.workspace-output .print-template-picker {grid-template-columns:1fr;}
.workspace-output .print-template-card {padding:13px;}
@media(max-width:1050px){.workspace.workspace-share,.workspace.workspace-output {grid-template-columns:170px minmax(0,1fr);}.output-preview-panel {grid-column:1/-1;width:100%;max-width:794px;margin:0 auto;}.workspace-output .print-template-picker {grid-template-columns:1fr 1fr;}}
@media(max-width:650px){.workspace.workspace-share,.workspace.workspace-output {display:block;}.output-preview-panel {margin-top:20px;}.workspace-output .print-template-picker {grid-template-columns:1fr;}}

/* 블록 공개 상태와 편집 도구 */
.editorpiece .accordion-toggle:hover,.editorpiece .drag-handle:hover {background:transparent;}
.item-tools {align-items:center;justify-content:space-between;}
.item-tools>button[data-del] {margin-left:auto;min-height:30px;padding:4px 11px;font-size:12px;line-height:20px;}
.item-tools .piece-visibility {display:inline-flex;flex:0 0 auto;min-width:0;align-items:center;gap:7px;font-size:12px;cursor:pointer;position:relative;}
.piece-visibility input {position:absolute;opacity:0;width:30px;height:18px;margin:0;}
.visibility-switch {display:inline-block;width:28px;height:16px;border-radius:12px;background:var(--ui-border-strong);position:relative;}
.visibility-switch:after {content:'';position:absolute;top:2px;left:2px;width:12px;height:12px;border-radius:50%;background:var(--ui-surface);}
.piece-visibility input:checked+.visibility-switch {background:var(--ui-primary);}
.piece-visibility input:checked+.visibility-switch:after {left:14px;}
.piece-visibility input:focus-visible+.visibility-switch {outline:2px solid var(--ui-primary);outline-offset:3px;}
.item-hidden .item-summary {opacity:.5;}
.visibility-badge {flex:none;font-size:10px;color:var(--ui-text-muted);padding:3px 6px;border-radius:4px;background:var(--ui-primary-soft);}
#resetdesign,#undodesign {font-size:12px;}
#undodesign {margin-left:10px;margin-top:10px;}
.skin .program.density-compact .focus-song .performer-name {text-align:right;}
/* 화면 폭이 아닌 공연 페이지 자체의 폭으로 반응형 처리 */
.skin {container-type:inline-size;container-name:concert;}
@container concert (max-width:400px){.sketch-copy h2 {font-size:34px;}.sketch-kicker,.sketch-meta {font-size:11px;}.moon-heading h2 {font-size:40px;}.moon-academy {font-size:24px;}.moon-date {font-size:13px;}.program.density-compact {padding-left:16px;padding-right:16px;}}
/* 네 번째 스킨: 달빛 정원 */
.theme-garden {background:#fbf4e6 url('assets/garden-piano.png') center/cover no-repeat;color:#244352;}
.skin-cover.cover-garden {aspect-ratio:210/297;min-height:0;padding:0;background:#fbf4e6 url('assets/garden-piano.png') center/cover no-repeat;color:#244352;}
.garden-heading {padding:12% 32% 0 8%;text-align:left;}
.garden-academy {font-size:14px;letter-spacing:1px;}
.garden-heading h2 {font-family:'Batang',Georgia,serif;font-size:36px;font-weight:600;line-height:1.35;margin:16px 0 12px;white-space:pre-line;word-break:keep-all;overflow-wrap:anywhere;}
.garden-heading .cover-subtitle {font-size:12px;line-height:1.6;color:#7c735c;}
.garden-meta {font-size:11px;line-height:1.8;margin-top:18px;white-space:pre-line;}
.skin-garden {--program-ink:#294858;--program-secondary:#8a7c61;--program-rule:#e0d1ad;--program-surface:#fcf7ec;}
.skin-garden .program {background:#fcf7ec;}
.skin-garden .program h3 {font-family:Georgia,serif;color:#294858;}
.skin-garden .program .caption {color:#ad8e54;}
.skin-garden .part-title h4 {font-family:'Batang',Georgia,serif;color:#44644c;}
.skin-garden .intermission {background:#f3ead4;color:#8a7c61;}
.skin-garden .invite,.skin-garden .footer {background:#f3ead4;color:#76654e;}
.skin-garden .memories,.skin-garden .memory-nav {background:#fcf7ec;}
.skin-garden .memories h3 {color:#294858;}
.skin-garden .memory-nav a {color:#44644c;border-color:#d8d4be;}
@container concert (max-width:400px){.garden-heading h2 {font-size:30px;}.garden-academy {font-size:12px;}.garden-meta {font-size:10px;}}

.item-hidden .accordion-head>.accordion-toggle {grid-template-columns:26px minmax(0,1fr) auto 16px;}
.editorpiece .drag-handle:hover {color:var(--ui-icon);border-color:transparent;}
/* 회원가입·계정 화면: 인증 연결 전 흐름 체험 */
.member-layout {max-width:980px;margin:30px auto;display:grid;grid-template-columns:1fr 420px;gap:70px;align-items:center;}
.member-intro h1 {font-size:38px;line-height:1.45;letter-spacing:-1.5px;margin:18px 0;}
.member-intro>p {font-size:15px;line-height:1.9;color:var(--ui-text-muted);margin-bottom:36px;}
.member-feature {display:flex;align-items:center;gap:14px;font-size:14px;margin:20px 0;line-height:1.7;}
.member-feature>span {font-size:12px;color:var(--ui-primary);background:var(--ui-primary-soft);padding:7px;border-radius:9px;}
.member-card {background:var(--ui-surface);border:1px solid var(--ui-border);border-radius:18px;padding:32px;max-width:500px;margin:30px auto;width:100%;}
.member-layout>.member-card {margin:0;}
.member-card h1 {font-size:25px;line-height:1.5;margin:20px 0 12px;}
.member-card h2 {font-size:26px;margin:12px 0;}
.member-card>p {font-size:14px;line-height:1.8;color:var(--ui-text-muted);}
.member-card .note {font-size:12px;line-height:1.8;}
.member-status {display:inline-block;font-size:11px!important;color:var(--ui-primary)!important;background:var(--ui-primary-soft);padding:5px 9px;border-radius:5px;margin:12px 0;}
.social-choices {display:grid;gap:10px;margin:18px 0;}
.social-choices button {display:flex;align-items:center;gap:12px;border:0;min-height:48px;font-size:14px;padding:12px 15px;opacity:1;cursor:not-allowed;}
.social-choices button:disabled {opacity:1;}
.social-choices button>span {width:18px;text-align:center;font-weight:800;}
.social-choices button>small {margin-left:auto;font-size:10px;font-weight:400;opacity:.7;}
.social-kakao,.social-kakao:disabled {background:#fee500;color:#191919;}
.social-naver,.social-naver:disabled {background:#03c75a;color:#fff;}
.social-google,.social-google:disabled {background:#fff;color:#30343b;box-shadow:inset 0 0 0 1px var(--ui-border);}
.member-full {width:100%;margin-top:12px;min-height:46px;font-size:13px;}
.member-secondary {background:transparent;color:var(--ui-text-muted);border-color:transparent;}
.member-policy-links {display:flex;justify-content:center;gap:12px;flex-wrap:wrap;margin-top:24px;}
.member-policy-links>button {font-size:11px;color:var(--ui-text-muted);padding:0;border:0;background:none;text-decoration:underline;text-underline-offset:3px;}
.member-back {padding:3px 0;border:0;background:none;font-size:13px;color:var(--ui-text-muted);}
.member-progress {display:flex;align-items:center;gap:12px;margin:25px 0 15px;color:var(--ui-text-muted);font-size:12px;}
.member-progress .current {font-weight:700;color:var(--ui-primary);}
.member-progress i {width:25px;height:1px;background:var(--ui-border);}
.member-onboarding {max-width:540px;}
.member-onboarding input[type=checkbox] {width:17px;height:17px;flex:none;accent-color:var(--ui-primary);margin:0;}
.consent-all {display:flex;align-items:center;gap:9px;font-size:14px;border-bottom:1px solid var(--ui-border);padding-bottom:18px;margin-top:25px;}
.consent-all small {font-size:11px;color:var(--ui-text-muted);font-weight:400;}
.consent-row {display:flex;align-items:center;gap:8px;justify-content:space-between;padding:11px 0;}
.consent-row label {display:flex;align-items:center;gap:9px;margin:0;font-size:12px;line-height:1.6;font-weight:400;}
.consent-row button {padding:5px 0 5px 8px;font-size:11px;flex:none;border:0;background:none;color:var(--ui-text-muted);text-decoration:underline;}
.member-error {color:var(--ui-danger);font-size:12px;line-height:1.6;}
.member-info {margin:26px 0;text-align:left;}
.member-info>div {display:flex;justify-content:space-between;gap:20px;padding:12px 0;font-size:13px;line-height:1.7;}
.member-info dt {color:var(--ui-text-muted);flex:none;}
.member-info dd {margin:0;text-align:right;overflow-wrap:anywhere;}
.member-avatar {display:flex;width:54px;height:54px;align-items:center;justify-content:center;border-radius:50%;background:var(--ui-primary-soft);color:var(--ui-primary);font-size:20px;margin:20px 0 12px;}
.member-policy-dialog {width:min(640px,94vw);max-height:85dvh;overflow:auto;padding:28px;border:1px solid var(--ui-border);border-radius:15px;background:var(--ui-surface);color:var(--ui-text);}
.member-policy-dialog::backdrop {background:var(--ui-overlay);}
.policy-top {display:flex;align-items:start;justify-content:space-between;gap:18px;}
.policy-top h2 {font-size:19px;line-height:1.6;margin:0;}
.policy-top button {flex:none;font-size:12px;}
.member-policy-dialog h3 {font-size:14px;margin:24px 0 8px;}
.member-policy-dialog section p {font-size:13px;line-height:1.9;white-space:pre-line;}
.notice-link {border:0;background:none;padding:5px;color:var(--ui-primary);font-size:12px;text-decoration:underline;}
@media(max-width:800px){.member-layout {grid-template-columns:1fr;gap:26px;max-width:500px;margin-top:10px;}.member-intro {display:none;}.member-card {padding:25px;}.member-layout>.member-card {max-width:none;}header nav {flex-wrap:wrap;gap:5px;}}
@media(max-width:400px){.member-card {padding:22px 18px;}.consent-row label {font-size:11px;}.member-card h1 {font-size:23px;}}

/* 인쇄 자동 배치: 전체 면에 동일한 글자 크기, 면별 제한된 여백 조정 */
.paper-sheet.paper-auto .paper-column {display:flex;flex-direction:column;}
.paper-sheet.paper-auto .paper-block {flex:none;}
.paper-sheet.paper-auto .paper-piece {padding:4px 0;}
.paper-sheet.paper-auto .paper-name,.paper-sheet.paper-auto .paper-song {font-size:var(--paper-auto-font,15px);line-height:1.6;}
.paper-sheet.paper-auto .paper-piece-body>small {font-size:11px;line-height:1.5;}
.print-density-picks {display:flex;flex-wrap:wrap;gap:7px;}
.print-density-picks button {font-size:12px;}

/* 순서지 조절: 숫자 대신 기본/조정 상태와 − / ＋로 표시 */
.program-tuning {border:1px solid var(--ui-border);border-radius:10px;padding:7px 14px;margin:0 0 24px;}
.tuning-row {display:flex;align-items:center;justify-content:space-between;gap:12px;padding:9px 0;font-size:13px;}
.tuning-stepper {display:flex;align-items:center;gap:8px;flex:none;}
.tuning-stepper button {width:34px;height:34px;min-height:34px;padding:0;border-radius:7px;font-size:18px;line-height:1;color:var(--ui-primary);}
.tuning-stepper button:disabled {opacity:.3;cursor:default;}
.tuning-stepper>span {font-size:11px;min-width:38px;text-align:center;color:var(--ui-text-muted);}
.tuning-reset {display:block;margin:5px 0 9px;padding:3px 0;font-size:11px;color:var(--ui-text-muted);border:0;background:none;text-decoration:underline;text-underline-offset:3px;}
.manual-layout-note {font-size:12px;line-height:1.7;color:var(--ui-primary);}
/* 넓은 화면에서 목록은 가운데 모으고, 행 안의 이름/곡명 정렬은 유지 */
.program-entries {width:100%;max-width:600px;margin-left:auto;margin-right:auto;}
.skin .program.program-adjustable .piece {width:100%;padding-top:var(--program-piece-pad);padding-bottom:var(--program-piece-pad);}
.skin .program.program-adjustable .piece-body {flex:1;min-width:0;}
.skin .program.program-adjustable .performer-name {font-size:var(--program-primary);}
.skin .program.program-adjustable .song {font-size:var(--program-secondary-size);}
.skin .program.program-adjustable .focus-song .song {font-size:var(--program-primary);}
.skin .program.program-adjustable .focus-song .performer-name {font-size:var(--program-secondary-size);}
.skin .program.program-adjustable .student-meta {font-size:var(--program-detail);}
.skin.without-intro>.program.program-adjustable .program-entries {margin-top:0;}
.paper-sheet.paper-adjusted .paper-name {font-size:var(--paper-tune-name);}
.paper-sheet.paper-adjusted .paper-song {font-size:var(--paper-tune-song);}
.paper-sheet.paper-adjusted .paper-piece-body>small {font-size:var(--paper-tune-detail);}
.paper-sheet.paper-adjusted .paper-piece {padding-top:var(--paper-tune-padding);padding-bottom:var(--paper-tune-padding);}
@media(pointer:coarse){.tuning-stepper button {width:40px;height:40px;min-height:40px;}}

/* 배열과 글자·간격은 독립: 기존 밀도 프리셋을 UI에서 제거 */
.arrangement-picker {margin:10px 0;}
.arrangement-picker button {display:flex;align-items:center;gap:10px;padding:12px 15px;}
.arrangement-diagram {display:flex;gap:4px;width:31px;}
.arrangement-diagram i {display:block;height:3px;background:var(--ui-icon);flex:1;}
.arrangement-diagram.stacked {flex-direction:column;width:23px;}
.arrangement-diagram.stacked i {flex:none;}
.arrangement-note {margin:8px 0 18px;}
.print-auto-label {display:flex;align-items:center;gap:8px;font-size:13px;margin:22px 0 16px;}
.print-auto-label input {width:17px;height:17px;margin:0;accent-color:var(--ui-primary);}
.paper-sheet .paper-piece-body .paper-song-group {min-width:0;white-space:pre-line;overflow-wrap:anywhere;}
.paper-sheet .paper-song-group>.paper-detail {display:block;font-size:var(--paper-tune-detail,11px);color:#756c7c;line-height:1.5;margin-top:2px;white-space:pre-line;}
.paper-sheet.paper-arrange-inline .paper-piece-body {display:grid;grid-template-columns:minmax(60px,1fr) minmax(0,3fr);column-gap:15px;align-items:baseline;}
.paper-sheet.paper-arrange-inline .paper-name {grid-column:1;grid-row:1;}
.paper-sheet.paper-arrange-inline .paper-song-group {grid-column:2;grid-row:1;}
.paper-sheet.paper-arrange-inline.paper-focus-song .paper-song-group {grid-column:1;}
.paper-sheet.paper-arrange-inline.paper-focus-song .paper-name {grid-column:2;text-align:right;}
.paper-sheet.paper-arrange-inline.paper-focus-song .paper-piece-body {grid-template-columns:minmax(0,3fr) minmax(60px,1fr);}
.paper-sheet.paper-arrange-stacked .paper-piece-body {display:flex;flex-direction:column;gap:2px;align-items:stretch;}
.paper-sheet.paper-arrange-stacked .paper-name {text-align:left;}
/* A4 가로 바깥면: 왼쪽 뒷표지, 오른쪽 A5 앞표지 */
.folded-cover-sheet {position:relative;display:flex;width:1123px;height:794px;background:#fff;overflow:hidden;transform-origin:top left;}
.folded-back,.folded-front {position:relative;width:561.5px;height:794px;flex:none;overflow:hidden;}
.folded-front>.cover-preview-sheet {width:550px;height:778px;transform:scale(1.02091);transform-origin:top left;}
.folded-front .skin {width:550px;height:778px;}
.folded-front .posterimg {width:550px;height:778px;object-fit:contain;background:#fff;}
.folded-back {display:flex;align-items:center;justify-content:center;background:var(--back-bg);color:var(--back-ink);padding:60px;box-sizing:border-box;}
.back-cover-content {width:100%;text-align:center;overflow-wrap:anywhere;}
.back-cover-content h2 {font-family:'Batang',Georgia,serif;font-size:27px;line-height:1.5;margin:0 0 25px;white-space:pre-line;}
.back-cover-content p {font-size:17px;line-height:1.9;white-space:pre-line;margin:0;}
.back-cover-qr {width:100px;height:100px;margin:38px auto 0;background:#fff;}
.back-cover-qr svg {display:block;width:100%;height:100%;}
.booklet-staging {position:absolute;left:-20000px;top:0;width:1123px;pointer-events:none;}
#exportbooklet {width:100%;margin-top:10px;}
#exportresult {white-space:pre-line;font-size:12px;line-height:1.8;color:var(--ui-text-muted);margin-top:12px;}
/* 내 공연 더보기 */
.concert-card {position:relative;overflow:visible;}
.concert-card-top {position:relative;border-radius:14px 14px 0 0;}
.concert-more {position:absolute;right:12px;top:12px;z-index:3;}
.concert-more>summary {list-style:none;display:flex;align-items:center;justify-content:center;width:34px;height:34px;cursor:pointer;border-radius:50%;background:var(--ui-surface);color:var(--ui-text);box-shadow:0 1px 6px var(--ui-shadow);}
.concert-more>summary::-webkit-details-marker {display:none;}
.concert-more>summary:focus-visible {outline:2px solid var(--ui-primary);outline-offset:3px;}
.concert-more-panel {position:absolute;right:0;top:41px;width:155px;padding:5px;border:1px solid var(--ui-border);border-radius:10px;background:var(--ui-surface);box-shadow:0 5px 20px var(--ui-shadow);}
.concert-more-panel button {display:block;width:100%;text-align:left;border:0;border-radius:6px;padding:12px;font-size:13px;background:none;color:var(--ui-text);}
.concert-more-panel button:hover {background:var(--ui-primary-soft);}
.concert-more-panel .concert-delete {color:var(--ui-danger);border-top:1px solid var(--ui-border);border-radius:0;margin-top:3px;}
.delete-concert-title {font-size:16px;font-weight:600;white-space:pre-line;overflow-wrap:anywhere;}
.danger {background:var(--ui-danger);border-color:var(--ui-danger);color:var(--ui-surface);}
.empty-concerts {grid-column:1/-1;text-align:center;padding:65px 20px;color:var(--ui-text-muted);}

/* 회의 반영: 간결한 관리 헤더, 압축한 편집 블록, 글자와 함께 조절되는 번호 */
.editor-topline {gap:12px;margin-bottom:18px;align-items:center;}
.editor-heading {display:flex;align-items:baseline;gap:14px;min-width:0;flex:1;}
.editor-heading h1 {margin:0;white-space:nowrap;font-size:25px;}
.editor-concert-title {min-width:0;font-size:14px;color:var(--ui-text-muted);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.editor-save {display:flex;align-items:center;gap:10px;flex-wrap:wrap;justify-content:flex-end;}
.editor-save .save-status {margin:0;font-size:12px;}
.editorpiece {padding:5px 10px;}
.accordion-content {padding:0 3px 5px;}
.accordion-content .item-tools {margin-top:9px;}
.skin .program.program-adjustable .piece .num {font-size:var(--program-number);min-width:1.6em;width:auto;height:auto;line-height:1.4;flex-shrink:0;}
.paper-sheet.paper-auto .paper-number {font-size:calc(var(--paper-auto-font,15px) - 2px);min-width:1.8em;flex-shrink:0;line-height:1.6;padding-top:0;}
.paper-sheet.paper-adjusted .paper-number {font-size:max(10px,calc(var(--paper-tune-name) - 2px));min-width:1.8em;flex-shrink:0;line-height:1.6;padding-top:0;}
@media(max-width:600px){.editor-topline {gap:10px;}.editor-heading {flex-basis:100%;}.editor-heading h1 {font-size:22px;}.editor-save {width:100%;justify-content:space-between;}.editor-save button {padding:9px 13px;}}

/* 운영 관리 — 실제 서비스 데이터와 구분되는 운영 화면 시안 */
.sr-only {position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0;}
.ops-shell {display:grid;grid-template-columns:184px minmax(0,1fr);gap:28px;align-items:start;}
.ops-sidebar {position:sticky;top:22px;padding:20px 15px;background:var(--ui-surface);border:1px solid var(--ui-border);border-radius:14px;}
.ops-sidebar-title {padding:0 10px 22px;}
.ops-sidebar-title span {display:block;font-size:12px;color:var(--ui-muted);}
.ops-sidebar-title b {font-size:20px;letter-spacing:-.7px;}




.ops-sidebar>p {margin:35px 10px 22px;font-size:12px;line-height:1.8;}
.ops-sidebar>button {font-size:12px;width:100%;padding:9px 5px;}
.ops-content {min-width:0;}
.ops-heading {display:flex;align-items:center;justify-content:space-between;gap:16px;margin-bottom:18px;}
.ops-heading h1 {font-size:28px;margin:3px 0 0;}
.ops-eyebrow {color:var(--ui-muted);font-size:12px;}
.ops-period {display:flex;align-items:center;gap:8px;flex-shrink:0;margin:0;font-size:12px;color:var(--ui-muted);}
.ops-period select {width:auto;margin:0;padding:8px 12px;font-size:13px;background:var(--ui-surface);}
.ops-demo-note {display:flex;align-items:baseline;gap:12px;padding:13px 16px;margin-bottom:20px;border:1px solid var(--ui-border-strong);background:var(--ui-soft);border-radius:10px;font-size:12px;color:var(--ui-text-muted);}
.ops-demo-note b {flex-shrink:0;color:var(--ui-primary);}
.ops-stats {display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;margin-bottom:20px;}
.ops-stat {display:flex;flex-direction:column;padding:19px 17px;border:1px solid var(--ui-border);background:var(--ui-surface);border-radius:12px;min-width:0;}
.ops-stat>span {font-size:12px;color:var(--ui-text-muted);}
.ops-stat>strong {font-size:25px;line-height:1.4;margin:9px 0;letter-spacing:-.8px;overflow-wrap:anywhere;font-variant-numeric:tabular-nums;}
.ops-stat>small {font-size:10px;color:var(--ui-text-muted);}
.ops-panel {background:var(--ui-surface);border:1px solid var(--ui-border);border-radius:12px;padding:22px;margin-bottom:20px;min-width:0;}
.ops-panel h2 {font-size:16px;margin:0 0 15px;letter-spacing:-.4px;}
.ops-panel h2 small {font-weight:400;color:var(--ui-muted);font-size:12px;margin-left:6px;}
.ops-panel-heading {display:flex;justify-content:space-between;align-items:center;gap:12px;margin-bottom:12px;}
.ops-panel-heading h2 {margin:0;}
.ops-panel-heading>.primary {font-size:12px;padding:9px 12px;flex-shrink:0;}
.ops-note {font-size:11px;color:var(--ui-text-muted);margin:12px 0 0;line-height:1.8;}
.ops-two-col {display:grid;grid-template-columns:minmax(0,1.5fr) minmax(0,1fr);gap:20px;}
.ops-check-row {display:flex;justify-content:space-between;align-items:baseline;gap:10px;padding:12px 0;border-bottom:1px solid var(--ui-border);font-size:12px;}
.ops-check-row b {font-size:13px;white-space:nowrap;}
.ops-check-row>span:last-child {color:var(--ui-muted);font-size:11px;}
.ops-chart {display:flex;align-items:stretch;gap:5px;height:185px;padding-top:20px;}
.ops-chart-column {display:flex;flex-direction:column;flex:1;min-width:0;align-items:stretch;}
.ops-chart-track {display:flex;align-items:flex-end;flex:1;border-bottom:1px solid var(--ui-border);}
.ops-chart-track>span {display:block;width:100%;min-height:2px;background:var(--ui-primary);opacity:.7;border-radius:4px 4px 0 0;}
.ops-chart-column:last-child .ops-chart-track>span {opacity:1;}
.ops-chart-column>small {height:20px;text-align:center;font-size:9px;color:var(--ui-muted);padding-top:5px;white-space:nowrap;}
.ops-table-scroll {overflow-x:auto;max-width:100%;}
.ops-table {width:100%;border-collapse:collapse;font-size:12px;text-align:left;}
.ops-table th {font-size:10px;font-weight:500;color:var(--ui-muted);white-space:nowrap;padding:11px 10px;background:var(--ui-quiet-surface);border-bottom:1px solid var(--ui-border);}
.ops-table td {padding:14px 10px;border-bottom:1px solid var(--ui-border);vertical-align:middle;min-width:70px;}
.ops-table td:first-child {min-width:140px;}
.ops-table td small {display:block;font-size:10px;color:var(--ui-muted);margin-top:4px;}
.ops-table td b {font-weight:600;}
.ops-table tr:last-child td {border-bottom:0;}
.ops-nowrap {white-space:nowrap;font-variant-numeric:tabular-nums;}
.ops-badge {display:inline-block;white-space:nowrap;font-size:10px;padding:3px 8px;border-radius:5px;background:var(--ui-preview-surface);color:var(--ui-text);}
.ops-badge.positive {background:var(--ui-soft);color:var(--ui-primary);}
.ops-badge.muted {color:var(--ui-muted);background:var(--ui-quiet-surface);}
.ops-text-button {font-size:11px;border:0;padding:6px 4px;color:var(--ui-primary);background:transparent;white-space:nowrap;}
.ops-filters {display:flex;gap:8px;align-items:center;margin:18px 0;}
.ops-filters label {margin:0;}
.ops-filters input,.ops-filters select {margin:0;padding:9px 11px;font-size:12px;}
.ops-filters .ops-search {flex:1;min-width:100px;}
.ops-filters button {font-size:12px;padding:9px 13px;white-space:nowrap;}
.ops-segments {display:flex;gap:5px;flex-wrap:wrap;margin-bottom:18px;}
.ops-segments button {font-size:12px;padding:8px 13px;}
.ops-segments button.selected {background:var(--ui-soft);color:var(--ui-primary);border-color:var(--ui-border-strong);}
.ops-empty {text-align:center;color:var(--ui-muted);padding:30px!important;}
.ops-form-grid {display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;}
.ops-coupon-form {padding:18px;background:var(--ui-quiet-surface);border:1px solid var(--ui-border);border-radius:9px;margin:20px 0;}
.ops-coupon-form h3 {margin:0 0 16px;font-size:14px;}
.ops-coupon-form label {margin:0;font-size:12px;}
.ops-coupon-form input {font-size:14px;background:var(--ui-surface);margin-top:6px;}
.ops-form-actions {display:flex;justify-content:flex-end;gap:8px;margin-top:15px;}
.ops-form-actions button {font-size:12px;}
.ops-footer {text-align:right;color:var(--ui-muted);font-size:10px;margin:22px 0;}
.ops-dialog {width:min(960px,94vw);max-height:90dvh;padding:0;border:1px solid var(--ui-border);border-radius:14px;color:var(--ui-text);background:var(--ui-surface);}
.ops-dialog::backdrop {background:var(--ui-overlay);}
.ops-dialog-heading {display:flex;justify-content:space-between;gap:15px;align-items:center;padding:20px 24px;border-bottom:1px solid var(--ui-border);}
.ops-dialog-heading h2 {font-size:19px;margin:0;}
.ops-dialog-heading button {padding:6px 10px;font-size:12px;}
.ops-dialog-note {padding:9px 24px;font-size:11px;background:var(--ui-soft);color:var(--ui-primary);}
.ops-dialog-body {padding:24px;}
.ops-dialog-body h3 {font-size:14px;margin:25px 0 12px;}
.ops-dialog-body>p {font-size:13px;}
.ops-detail-list {margin:10px 0 22px;}
.ops-detail-list>div {display:grid;grid-template-columns:150px minmax(0,1fr);gap:15px;padding:11px 0;border-bottom:1px solid var(--ui-border);font-size:13px;}
.ops-detail-list dt {color:var(--ui-muted);}
.ops-detail-list dd {margin:0;overflow-wrap:anywhere;}
.ops-guest-example {max-width:550px;margin:auto;container-type:inline-size;container-name:concert;}
@media(max-width:1100px){.ops-shell {grid-template-columns:155px minmax(0,1fr);gap:18px;}.ops-stats {grid-template-columns:repeat(2,minmax(0,1fr));}.ops-two-col {grid-template-columns:minmax(0,1fr);gap:0;}}
@media(max-width:700px){.ops-shell {display:block;}.ops-sidebar {position:static;padding:10px;margin-bottom:20px;}.ops-sidebar-title,.ops-sidebar>p,.ops-sidebar>button {display:none;}.ops-heading h1 {font-size:24px;}.ops-period {display:block;font-size:10px;}.ops-period select {display:block;margin-top:4px;font-size:12px;}.ops-panel {padding:16px;}.ops-stat {padding:15px 12px;}.ops-stat>strong {font-size:23px;}.ops-demo-note {display:block;}.ops-demo-note b {display:block;margin-bottom:3px;}.ops-filters {flex-wrap:wrap;}.ops-filters .ops-search {flex-basis:100%;}.ops-form-grid {grid-template-columns:minmax(0,1fr);}.ops-dialog-body {padding:16px;}.ops-detail-list>div {grid-template-columns:110px minmax(0,1fr);font-size:12px;}.ops-table {min-width:610px;}.ops-footer {text-align:left;}.ops-chart {gap:3px;}}

/* 공연별 이용권과 쿠폰 — 체험용 주문 내역 */
.concert-use-panel {display:flex;align-items:center;justify-content:space-between;gap:12px;margin:-3px 0 18px;padding:10px 14px;background:var(--ui-soft);border:1px solid var(--ui-border);border-radius:9px;font-size:12px;color:var(--ui-muted);}
.concert-use-panel b {color:var(--ui-primary);font-weight:600;}
.concert-use-panel button {font-size:12px;padding:6px 10px;background:var(--ui-surface);white-space:nowrap;}
.use-badge {margin-right:5px;}
.checkout-card {max-width:600px;margin:0 auto;background:var(--ui-surface);border:1px solid var(--ui-border);border-radius:15px;padding:30px;}
.checkout-card>.member-status {display:block;width:fit-content;margin:17px 0 8px;}
.checkout-card h1 {font-size:26px;}
.checkout-card h2 {font-size:17px;white-space:pre-line;}
.checkout-card>p {font-size:13px;}
.checkout-summary {margin:22px 0;}
.checkout-summary>div {display:flex;justify-content:space-between;gap:18px;padding:12px 0;border-bottom:1px solid var(--ui-border);font-size:14px;}
.checkout-summary dt {color:var(--ui-muted);}
.checkout-summary dd {margin:0;text-align:right;overflow-wrap:anywhere;}
.checkout-total strong {font-size:24px;color:var(--ui-primary);}
.coupon-input-row {display:flex;gap:8px;align-items:center;}
.coupon-input-row input {margin:0;min-width:0;flex:1;}
.coupon-input-row button {flex-shrink:0;}
.checkout-card button:disabled {opacity:.45;cursor:not-allowed;}
.preview-links {display:flex;gap:6px;flex-wrap:wrap;justify-content:flex-end;}
.preview-links button {font-size:10px;padding:4px 7px;}
/* 직접 올린 표지용 완성된 색 세트 */
.program-palette-grid {display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:7px;margin:9px 0 6px;}
.program-palette {padding:3px;border-radius:8px;text-align:center;min-width:0;}
.program-palette>span {display:flex;align-items:center;justify-content:center;min-height:40px;padding:7px 1px;background:var(--palette-bg);color:var(--palette-ink);border-radius:5px;font-size:11px;white-space:nowrap;}
.program-palette b {font-size:11px;}
.program-palette small {font-size:9px;color:var(--palette-secondary);}
.program-palette em {display:block;font-style:normal;font-size:10px;padding:5px 3px 1px;}
.program-palette.chosen {border-color:var(--ui-primary);box-shadow:0 0 0 1px var(--ui-primary);}
.skin.skin-custom .program,.skin.skin-custom .invite,.skin.skin-custom .memories,.skin.skin-custom .footer,.skin.skin-custom .archived-program,.skin.skin-custom .memory-nav {background:var(--program-surface);color:var(--program-ink);}
.skin.skin-custom .program h3,.skin.skin-custom .program .performer-name,.skin.skin-custom .program .part-title,.skin.skin-custom .program .num,.skin.skin-custom .memories h3,.skin.skin-custom .archived-program summary {color:var(--program-ink);}
.skin.skin-custom .program .song,.skin.skin-custom .program .student-meta,.skin.skin-custom .program .caption,.skin.skin-custom .program .part-title p,.skin.skin-custom .memories>small {color:var(--program-secondary);}
.skin.skin-custom .program .intermission {color:var(--program-secondary);background:transparent;}
.skin.skin-custom .memory-nav a {color:var(--program-ink);border-color:var(--program-secondary);}
.skin.skin-custom .program .num {background:transparent;}
.back-color-fields {display:flex;align-items:center;gap:8px;margin:8px 0;}
.back-color-fields input[type=color] {padding:3px;width:44px;height:39px;flex-shrink:0;margin:0;}
.back-color-fields input[type=text] {width:110px;margin:0;font-family:monospace;font-size:14px;}
.back-color-fields button {font-size:12px;padding:8px 10px;white-space:nowrap;}
.mini-program-preview {display:none;max-height:none;overflow:visible;border:1px solid var(--ui-border);border-radius:10px;margin:18px 0 12px;}
.mini-program-preview>span {display:block;padding:7px 12px;background:var(--ui-quiet-surface);font-size:11px;color:var(--ui-muted);position:sticky;top:0;z-index:1;}
.mini-program-preview .skin .program {padding:16px 18px;}
.mini-program-preview .skin .program h3,.mini-program-preview .caption {display:none;}
.mini-program-preview .program-entries {margin-top:0!important;}
/* 모바일 메뉴는 전각 공백 없이 동일한 좌우 여백으로 표시 */

@media(max-width:650px){.steps .hint {display:none;}}
@media(max-width:1050px){.mini-program-preview {display:block;}}
@media(max-width:600px){.checkout-card {padding:22px 18px;}.checkout-card h1 {font-size:23px;}.checkout-summary>div {font-size:13px;}.concert-use-panel {font-size:11px;}}
/* 독립된 URL의 전체 화면 편집 미리보기 */
.draft-preview-screen {max-width:650px;margin:auto;}
.draft-preview-bar {display:flex;justify-content:space-between;align-items:center;gap:12px;background:var(--ui-surface);border:1px solid var(--ui-border);padding:12px 16px;margin-bottom:14px;border-radius:10px;font-size:12px;}
.draft-preview-bar small {display:block;font-size:10px;color:var(--ui-muted);margin-top:3px;}
.draft-preview-bar button {font-size:11px;padding:7px 10px;white-space:nowrap;}
.draft-preview-concert {container-type:inline-size;container-name:concert;}
body:has(.draft-preview-screen)>header {display:none;}
body:has(.draft-preview-screen)>main {padding:12px;}
/* 사진은 손가락을 따라 움직이고 다음 이미지에 안착합니다. */
.photo-dialog {overflow:hidden;padding:16px;}
.photo-viewport {position:relative;overflow:hidden;width:100%;height:min(70dvh,650px);touch-action:pan-y;}
.photo-track {display:flex;width:100%;height:100%;will-change:transform;}
.photo-slide {flex:0 0 100%;min-width:0;display:flex;align-items:center;justify-content:center;height:100%;}
.photo-slide img {width:100%;height:100%;max-height:none;object-fit:contain;user-select:none;-webkit-user-drag:none;}
.photo-arrow {position:absolute;top:50%;transform:translateY(-50%);display:flex;align-items:center;justify-content:center;width:44px;height:52px;padding:0;font-size:30px;line-height:1;color:var(--ui-text);background:var(--ui-surface);opacity:.85;border:1px solid var(--ui-border);border-radius:9px;}
.photo-arrow-prev {left:4px;}
.photo-arrow-next {right:4px;}
.photo-arrow:hover {opacity:1;}
.photo-dialog button.photo-arrow:disabled {opacity:.2;cursor:default;}
@media(prefers-reduced-motion:reduce){.photo-track {transition:none!important;}}

/* 무료 확인 화면 및 출력 파일 — 이용권 적용 시 제거 */
.preview-watermark {position:relative;isolation:isolate;}
.preview-watermark::after,.free-photo-preview .photo-slide::after {content:"";position:absolute;inset:0;z-index:9;pointer-events:none;background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%22360%22%20height%3D%22190%22%3E%3Cg%20transform%3D%22rotate%28-22%20180%2095%29%22%3E%3Ctext%20x%3D%22180%22%20y%3D%22100%22%20text-anchor%3D%22middle%22%20font-family%3D%22sans-serif%22%20font-size%3D%2224%22%20font-weight%3D%22600%22%20fill%3D%22white%22%20fill-opacity%3D%22.22%22%20stroke%3D%22%2328232f%22%20stroke-opacity%3D%22.09%22%20stroke-width%3D%22.7%22%3E%EB%AC%B4%EB%8C%80%EC%A4%80%EB%B9%84%20%EB%AF%B8%EB%A6%AC%EB%B3%B4%EA%B8%B0%3C%2Ftext%3E%3C%2Fg%3E%3C%2Fsvg%3E");background-repeat:repeat;background-size:360px 190px;}
.free-photo-preview .photo-slide {position:relative;}
.photo-arrow {z-index:10;}
.free-preview-note {font-size:11px;line-height:1.7;padding:9px 12px;margin:0;background:var(--ui-soft);color:var(--ui-muted);}
.free-preview-note button {font-size:11px;padding:3px 6px;margin-left:5px;}
/* 모바일은 버튼으로 여는 전체 화면 미리보기를 사용 */
.mobile-preview-title {min-width:0;}
.mobile-preview-title>b {display:block;font-size:12px;}
.mobile-preview-title .save-status {display:block;margin:3px 0 0;font-size:10px;}
.mobile-preview-actions {display:flex;gap:6px;align-items:center;flex-shrink:0;}
.mobile-preview-actions button {padding:7px 10px;font-size:11px;min-height:34px;}
.mobile-preview-bar {z-index:20;}
@media(max-width:1050px){.workspace>.previewcol {display:none;}.mobile-preview-dialog {width:100vw;max-width:100vw;height:100dvh;max-height:100dvh;margin:0;border:0;border-radius:0;overflow-y:auto;}.mobile-preview-bar {padding:10px 12px;}.mobile-preview-content {container-type:inline-size;container-name:concert;}.mobile-preview-save {padding-bottom:calc(18px + env(safe-area-inset-bottom));}}
/* 엽서의 실제 종횡비. 업로드 이미지는 늘리거나 자르지 않고 맞춥니다. */
.cover-preview-sheet.postcard-sheet,.cover-preview-sheet.postcard-sheet>.skin {height:var(--postcard-height,825px);}
.cover-preview-sheet.postcard-sheet .skin-cover {width:550px;height:var(--postcard-height,825px);min-height:0;aspect-ratio:auto;background-size:cover;}
.cover-preview-sheet.postcard-sheet .posterimg {height:var(--postcard-height,825px);object-fit:contain;background:#fff;}
.postcard-export-host {position:fixed;left:-10000px;top:0;width:550px;z-index:-1;}
.postcard-downloads {display:flex;gap:8px;flex-wrap:wrap;margin-top:16px;}
.postcard-downloads button {font-size:12px;}
.self-print-guide {margin:16px 0;}
.self-print-guide summary {font-size:12px;}
.self-print-guide p {font-size:11px;line-height:1.8;}
/* 1:1 문의: 사용자 문의와 운영자 답변을 같은 흐름으로 확인 */
.support-page {max-width:800px;margin:auto;}
.support-page .topline h1 {font-size:27px;}
.support-page .topline p {font-size:13px;}
.support-page>.sectiontitle {margin:25px 0 15px;}
.support-page>.sectiontitle small {font-size:12px;font-weight:400;color:var(--ui-muted);}
.support-page .panel {margin:20px 0;}
.support-ticket {border:1px solid var(--ui-border);border-radius:10px;background:var(--ui-surface);margin-top:10px;overflow:hidden;}
.support-ticket>summary {display:flex;justify-content:space-between;align-items:center;gap:12px;padding:16px;cursor:pointer;list-style:none;}
.support-ticket>summary::-webkit-details-marker {display:none;}
.support-ticket>summary span {min-width:0;}
.support-ticket>summary b {display:block;font-size:14px;overflow-wrap:anywhere;margin-top:3px;}
.support-ticket>summary small {font-size:10px;color:var(--ui-muted);}
.support-ticket>summary em {font-style:normal;flex-shrink:0;}
.support-ticket-body {padding:0 16px 18px;}
.support-message {white-space:pre-wrap;overflow-wrap:anywhere;font-size:13px;color:var(--ui-text);}
.support-reply {margin-top:20px;padding:15px;background:var(--ui-soft);border-radius:8px;}
.support-reply>b {font-size:12px;}
.support-reply>small {font-size:10px;display:block;color:var(--ui-muted);}
.support-ticket-body form {margin-top:20px;}
.support-ticket-body form button {font-size:12px;padding:7px 12px;}





/* 배열은 글자 크기를 바꾸지 않으며 첫 행의 글자 기준선에 번호를 맞춥니다. */
.skin .program.program-adjustable.density-compact .piece {align-items:baseline;}
.skin .program.program-adjustable.density-compact .piece .num {align-self:baseline;line-height:1.6;padding-top:0;}
.skin .program.program-adjustable.density-compact .avatar {align-self:flex-start;}
/* 조절 미리보기에는 실제 스킨 색상과 장식을 사용하지 않습니다. */
.mini-program-preview .adjustment-preview-skin {background:#fff;color:#302a38;--program-ink:#302a38;--program-muted:#80758b;--program-rule:transparent;}
.mini-program-preview .adjustment-preview-skin .program {background:#fff;color:#302a38;}
.mini-program-preview .adjustment-preview-skin .performer-name,.mini-program-preview .adjustment-preview-skin .song,.mini-program-preview .adjustment-preview-skin .num {color:#302a38;}
.mini-program-preview .adjustment-preview-skin .student-meta {color:#80758b;}

.palette-default {border:0;background:none;padding:4px 0;font-size:11px;color:var(--ui-muted);text-decoration:underline;text-underline-offset:3px;}
.saved-cover {display:flex;align-items:center;gap:14px;margin:12px 0;}
.saved-cover img {width:64px;height:90px;object-fit:contain;background:var(--ui-quiet-surface);border:1px solid var(--ui-border);border-radius:5px;}
.saved-cover button {font-size:12px;padding:8px 12px;}

/* 운영관리 · 공연관리 메뉴 공통: 버튼 표현은 이 클래스에서만 관리 */
:root {--side-menu-font:15px;--side-menu-radius:8px;--side-menu-padding:11px 10px;--side-menu-gap:5px;}
.steps {padding:12px;}
.side-menu {display:flex;flex-direction:column;justify-content:flex-start;gap:var(--side-menu-gap);min-width:0;}
.side-menu .side-menu__item {display:flex;align-items:center;justify-content:flex-start;gap:8px;flex:none;width:100%;min-height:44px;margin:0;padding:var(--side-menu-padding);border:0;border-radius:var(--side-menu-radius);background:transparent;color:var(--ui-text);font-size:var(--side-menu-font);font-weight:400;line-height:1.5;text-align:left;white-space:nowrap;}
.side-menu .side-menu__item>span {font-size:inherit;}
.side-menu .side-menu__item>small {flex:none;color:var(--ui-icon);font-size:10px;font-weight:400;}
.side-menu .side-menu__item:hover {background:var(--ui-quiet-surface);}
.side-menu .side-menu__item.selected {background:var(--ui-soft);color:var(--ui-primary);font-weight:700;}
.side-menu .side-menu__item:focus-visible {outline:2px solid var(--ui-primary);outline-offset:2px;}
@media(max-width:700px){
.workspace {display:block;}
.steps {padding:5px;margin-bottom:15px;}
.steps .hint {display:none;}
.side-menu {flex-direction:row;gap:4px;overflow-x:auto;padding:2px;}
.side-menu .side-menu__item {width:auto;min-height:40px;padding:10px 14px;font-size:13px;}
.side-menu .side-menu__item>small {display:none;}
}

.program-palette:hover {background:var(--ui-surface);border-color:var(--ui-primary);}

/* 순서지 디자인은 표지 스킨과 독립적으로 적용합니다. */
.design-section-title {font-size:17px;margin:26px 0 12px;}
.design-section-title:first-child {margin-top:0;}
.program-design-picker {display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:7px;}
.program-design-picker button {min-width:0;padding:12px 3px;}
.program-design-picker b {display:block;font-size:11px;font-weight:500;margin-top:8px;}
.design-sample {font-size:13px;}
.design-sample-classic {font-family:Georgia,serif;font-style:italic;}
.design-sample-modern {font-weight:800;letter-spacing:-.5px;}
.design-sample-soft {font-family:Georgia,serif;font-style:italic;}
.skin .program.program-adjustable {background:var(--program-surface,#fff);color:var(--program-ink,#303039);font-family:'Pretendard','Apple SD Gothic Neo',sans-serif;}
.skin .program.program-adjustable h3 {font-family:inherit;font-size:28px;font-weight:600;font-style:normal;letter-spacing:0;color:inherit;}
.skin .program-design-classic.program-adjustable h3 {font-family:Georgia,serif;font-weight:400;font-style:italic;letter-spacing:1px;}
.skin .program-design-classic .part-title h4::before,.skin .program-design-classic .part-title h4::after {content:'✧';font-size:12px;margin:0 9px;opacity:.6;}
.skin .program-design-modern.program-adjustable h3 {font-weight:800;letter-spacing:-1px;text-transform:uppercase;}
.skin .program-design-modern .part-title {text-align:left;padding-left:12px;border-left:3px solid currentColor;}
.skin .program-design-modern .num {font-weight:700;}
.skin .program-design-soft.program-adjustable h3 {font-family:Georgia,serif;font-style:italic;font-weight:400;}
.skin .program-design-soft .part-title {border-radius:10px;background:color-mix(in srgb,currentColor 6%,transparent);padding:12px;}
.skin .program.program-adjustable .performer-name,.skin .program.program-adjustable .song,.skin .program.program-adjustable .student-meta,.skin .program.program-adjustable .num,.skin .program.program-adjustable .part-title {font-family:'Pretendard','Apple SD Gothic Neo',sans-serif;}

.skin .program.program-adjustable .song,.skin .program.program-adjustable .student-meta,.skin .program.program-adjustable .caption {color:var(--program-secondary,#656570);}
.skin .program.program-adjustable .performer-name,.skin .program.program-adjustable .num,.skin .program.program-adjustable .part-title {color:var(--program-ink,#303039);}

/* 모바일 내 공연 목록: 한 줄에 두 장씩, A계열 포스터 비율로 표시합니다. */
@media(max-width:600px){.concert-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.concert-card-top{aspect-ratio:1054/1492;min-height:0;padding:18px 14px 14px}.concert-card-top h2{font-size:clamp(16px,4.4vw,21px);line-height:1.35;margin:12px 0}.concert-card-body{padding:13px}.concert-card-body p{font-size:12px;margin:10px 0}.concert-card-body>div{gap:6px}.concert-card-body button{font-size:11px;padding:8px 9px}}

/* 내 공연 목록은 현재 활성화된 업로드 표지를 표시합니다. 보관본만 있으면 템플릿을 유지합니다. */
.concert-card-top.concert-card-uploaded {padding:0;min-height:0;aspect-ratio:210/297;background:var(--ui-surface);overflow:visible;}
.concert-card-cover-image {position:absolute;inset:0;width:100%;height:100%;object-fit:contain;border-radius:14px 14px 0 0;}
.concert-card-body>.concert-card-uploaded-info {display:block;margin-bottom:13px;}
.concert-card-uploaded-info small,.concert-card-uploaded-info>span {font-size:11px;color:var(--ui-muted);}
.concert-card-uploaded-info h2 {font-size:18px;line-height:1.45;margin:5px 0;white-space:pre-line;overflow-wrap:anywhere;}
@media(max-width:600px){.concert-card-uploaded-info h2 {font-size:15px;}.concert-card-uploaded-info small,.concert-card-uploaded-info>span {font-size:10px;}}

/* 디자인 설정: 기본 선택과 필요할 때만 여는 세부 조정 */
.design-intro {margin:0 0 26px;}
.design-intro h2 {font-size:19px;line-height:1.5;letter-spacing:-.6px;margin:0 0 8px;}
.design-intro p {font-size:13px;line-height:1.8;color:var(--ui-text-muted);margin:0;}
.design-block {padding:0 0 28px;margin-bottom:28px;border-bottom:1px solid var(--ui-border);}
.design-block-heading {margin-bottom:18px;}
.design-block-heading h3 {font-size:17px;margin:0 0 4px;}
.design-block-heading>span {font-size:12px;color:var(--ui-text-muted);}
.design-details {margin-top:18px;padding:0;border:1px solid var(--ui-border);border-radius:10px;background:var(--ui-surface,#fff);}
.design-details>summary {display:flex;align-items:center;gap:9px;padding:14px;cursor:pointer;font-size:13px;font-weight:600;list-style:none;}
.design-details>summary::-webkit-details-marker {display:none;}
.design-details>summary svg {margin-left:auto;transition:transform .2s;flex-shrink:0;}
.design-details[open]>summary svg {transform:rotate(180deg);}
.design-details>summary small {font-size:10px;font-weight:500;color:var(--ui-primary);background:var(--ui-primary-soft,#f4effb);border-radius:5px;padding:3px 6px;}
.design-details-body {padding:0 14px 14px;}
.design-details-body>label:first-of-type {margin-top:12px;}
.cover-font-picks {display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:6px;margin-bottom:18px;}
.cover-font-picks button {font-size:12px;padding:10px 4px;}
.design-reset-actions {display:flex;flex-wrap:wrap;gap:12px;margin-top:22px;}
.design-reset-actions button {font-size:11px;padding:7px 10px;}
.design-save-note {font-size:12px;color:var(--ui-text-muted);line-height:1.7;}
.design-block .program-palette-grid {grid-template-columns:repeat(6,minmax(0,1fr));gap:6px;}
.design-block .program-palette {min-height:38px;font-size:11px;padding:6px 2px;}
.skin .program-design-basic.program-adjustable h3 {font-family:Georgia,serif;font-weight:400;font-style:italic;letter-spacing:1px;text-transform:none;}
.skin .program.program-adjustable .piece {align-items:baseline;}
.skin .program.program-adjustable .piece .num {display:block;align-self:baseline;line-height:1.6;padding:0;margin-top:0;transform:none;}
.skin .program.program-adjustable .piece-body {display:block;}
.skin .program.program-adjustable .piece-body>.performer-name,.skin .program.program-adjustable .piece-body>.song {line-height:1.6;}
.skin .program.program-adjustable.density-compact .piece-body {display:grid;align-items:baseline;}
@media(max-width:600px){.design-block .program-palette-grid {grid-template-columns:repeat(4,minmax(0,1fr));}.design-intro h2 {font-size:18px;}.design-block {margin-bottom:24px;padding-bottom:24px;}}

/* 내 공연 / 관리 메뉴: PC와 모바일에서 각각 읽기 쉬운 배열 */
@font-face {font-family:'StageJalnan';src:url('assets/fonts/Jalnan2.otf') format('opentype');font-weight:400;font-style:normal;font-display:swap;}
.concert-grid {grid-template-columns:repeat(4,minmax(0,1fr));}
.cover-font-picks {grid-template-columns:repeat(2,minmax(0,1fr));}
.font-license-link {font-size:11px;color:var(--ui-text-muted);text-underline-offset:3px;}
.skin .program-design-basic.program-adjustable h3 {font-size:24px;line-height:1.4;}
@media(min-width:901px) and (max-width:1100px){.concert-grid {grid-template-columns:repeat(3,minmax(0,1fr));}}
@media(max-width:900px){.concert-grid {grid-template-columns:repeat(2,minmax(0,1fr));}}
@media(max-width:700px){.steps .side-menu {display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:4px;overflow:visible;padding:2px;}.steps .side-menu .side-menu__item {width:100%;min-width:0;justify-content:center;min-height:40px;padding:10px 4px;font-size:13px;text-align:center;}.steps {padding:5px;}}

/* 세로 기본형도 접지 없는 2단 내지로 사용 */
.paper-template-portrait .paper-columns {grid-template-columns:repeat(2,minmax(0,1fr));gap:30px;}
.print-template-diagram.portrait {display:flex;gap:5px;}
.print-template-diagram.portrait>i {flex:1;min-width:0;}

/* 6종 새 공연 표지 — 그림과 편집 글자를 분리합니다. */
@font-face {font-family:'StageSerif';src:url('assets/fonts/NotoSerifKR-SemiBold.woff2') format('woff2');font-weight:400;font-style:normal;font-display:swap;}
.skin-cover.art-cover {aspect-ratio:210/297;min-height:0;padding:0;background-position:center;background-size:100% 100%;background-repeat:no-repeat;color:var(--cover-ink);font-family:'StageSerif','Batang',Georgia,serif;}
.cover-editorial {--cover-ink:#1f211e;background-image:var(--cover-image,url('assets/covers/editorial.webp'));background-color:#f7f2e7;}
.cover-nocturne {--cover-ink:#f5e4bf;background-image:var(--cover-image,url('assets/covers/nocturne.webp'));background-color:#211910;}
.cover-collage {--cover-ink:#123d78;background-image:var(--cover-image,url('assets/covers/collage.webp'));background-color:#fbf4e6;}
.cover-watercolor {--cover-ink:#39274f;background-image:var(--cover-image,url('assets/covers/watercolor.webp'));background-color:#f1eaf6;}
.cover-deco {--cover-ink:#e8c99c;background-image:var(--cover-image,url('assets/covers/deco.webp'));background-color:#11110f;}
.cover-clay {--cover-ink:#963e1e;background-image:var(--cover-image,url('assets/covers/clay.webp'));background-color:#f4d98c;}
.art-cover .art-cover-copy {position:absolute;left:8.5%;top:11%;width:80%;}
.art-cover .art-cover-academy {font-size:3.3cqw;line-height:1.5;letter-spacing:.08em;white-space:pre-line;overflow-wrap:anywhere;}
.art-cover .art-cover-copy h2 {font-family:inherit;font-weight:600;line-height:1.22;letter-spacing:-.055em;margin:4cqw 0 3cqw;white-space:pre-line;word-break:keep-all;overflow-wrap:anywhere;color:inherit;}
.art-cover .art-cover-subtitle {font-size:3.1cqw;line-height:1.5;white-space:pre-line;overflow-wrap:anywhere;}
.art-cover .art-cover-meta {font-size:3.15cqw;line-height:1.6;margin-top:4cqw;white-space:pre-line;overflow-wrap:anywhere;}
.art-cover .art-cover-meta>div+div {font-size:2.65cqw;margin-top:1cqw;}
.cover-editorial .art-cover-copy {top:10%;width:75%;}
.cover-editorial .art-cover-copy h2 {margin-top:8cqw;font-weight:600;line-height:1.1;letter-spacing:-.08em;}
.cover-editorial>.art-cover-meta {position:absolute;left:8.5%;top:74%;width:80%;margin:0;}
.cover-nocturne .art-cover-copy {width:78%;}
.cover-nocturne .art-cover-copy h2 {font-weight:500;letter-spacing:-.045em;}
.cover-collage .art-cover-copy {top:8%;width:72%;font-family:'Pretendard','Apple SD Gothic Neo',sans-serif;}
.cover-collage .art-cover-copy h2 {font-family:'StageJalnan',sans-serif;font-weight:400;line-height:1.16;letter-spacing:-.06em;margin-top:3cqw;}
.cover-collage .art-cover-meta {font-family:'StageSerif',serif;font-size:3.3cqw;}
.cover-watercolor .art-cover-copy {top:12%;width:83%;}
.cover-watercolor .art-cover-copy h2 {margin-top:6cqw;letter-spacing:-.07em;}
.cover-deco .art-cover-copy {top:25%;left:18%;width:64%;text-align:center;}
.cover-deco .art-cover-academy {font-size:3cqw;letter-spacing:.12em;}
.cover-deco .art-cover-copy h2 {margin:4cqw 0 3cqw;font-weight:500;line-height:1.28;letter-spacing:-.055em;}
.cover-deco .art-cover-subtitle {font-size:2.7cqw;}
.cover-deco .art-cover-meta {font-size:3cqw;letter-spacing:.07em;margin-top:3cqw;}
.cover-clay .art-cover-copy {top:8%;width:80%;font-family:'Pretendard','Apple SD Gothic Neo',sans-serif;}
.cover-clay .art-cover-copy h2 {font-weight:800;line-height:1.16;letter-spacing:-.07em;margin-top:3cqw;}
.concert-card-top.concert-card-template {position:relative;padding:0;aspect-ratio:210/297;min-height:0;overflow:hidden;background:#f7f3ec;}
.concert-card-visual {position:absolute;inset:0;width:100%;height:100%;}
.concert-card-visual>.skin {width:100%;height:100%;}
.concert-card-visual .skin-cover {width:100%;height:100%;min-height:0;aspect-ratio:auto;}
.concert-card-visual .skin-cover h2 {margin-bottom:3cqw;}

.cover-collage .art-cover-copy h2 {max-width:55cqw;}
.cover-clay .art-cover-copy h2 {max-width:62cqw;}

/* 콘텐츠 사용 스위치와 접힘 요약 */
.content-section {margin:18px 0;border:1px solid var(--ui-border,#e4e0eb);border-radius:12px;overflow:hidden;}
.content-section-head {display:flex;align-items:center;gap:10px;padding:12px 14px;}
.content-section-toggle {display:flex;align-items:center;gap:10px;flex:1;min-width:0;padding:4px 0;border:0;background:transparent;text-align:left;color:inherit;}
.content-section-toggle:hover {background:transparent;}
.content-section-toggle>span:first-child {font-weight:600;white-space:nowrap;}
.content-section-toggle small {font-size:12px;color:var(--ui-muted,#85808e);font-weight:400;}
.content-section-toggle .expand-chevron {display:block;width:7px;height:7px;border-right:1.5px solid currentColor;border-bottom:1.5px solid currentColor;margin-left:auto;margin-right:4px;flex-shrink:0;transform:rotate(45deg);color:var(--ui-icon);}
.content-section-toggle[aria-expanded="true"] .expand-chevron {transform:rotate(225deg);}
.section-use {display:flex;align-items:center;gap:6px;position:relative;margin:0;font-size:11px;white-space:nowrap;cursor:pointer;}
.section-use input {position:absolute;width:1px;height:1px;opacity:0;}
.section-switch {position:relative;width:30px;height:18px;border-radius:12px;background:#c8c5cf;transition:background .15s;}
.section-switch:after {content:"";position:absolute;width:14px;height:14px;left:2px;top:2px;border-radius:50%;background:#fff;transition:transform .15s;}
.section-use input:checked+.section-switch {background:var(--ui-primary,#84719d);}
.section-use input:checked+.section-switch:after {transform:translateX(12px);}
.section-use input:focus-visible+.section-switch {outline:2px solid var(--ui-primary,#84719d);outline-offset:3px;}
.content-section-body {padding:0 16px 18px;border-top:1px solid var(--ui-border,#e4e0eb);}
.content-section-off .content-section-head {color:var(--ui-muted,#85808e);}
@media(max-width:600px) {.content-section-head {padding:10px;gap:8px;} .content-section-toggle {gap:6px;} .content-section-toggle>span:first-child {font-size:14px;} .content-section-toggle small {font-size:11px;} .section-use {font-size:10px;} .content-section-body {padding:0 12px 14px;}}

/* PC 공연 편집 공간: 입력과 인쇄 미리보기에 충분한 폭을 배정합니다. */
:root {--editor-max-width:1600px;--editor-menu-width:190px;--editor-preview-width:380px;}
@media(min-width:1051px) {
main:has(.workspace) {max-width:var(--editor-max-width);padding-left:32px;padding-right:32px;}
.workspace {grid-template-columns:var(--editor-menu-width) minmax(0,1fr) var(--editor-preview-width);}
.workspace.workspace-share {grid-template-columns:var(--editor-menu-width) minmax(0,1fr);}
.workspace.workspace-output {grid-template-columns:180px minmax(290px,.8fr) minmax(430px,1.4fr);}
.workspace-output .cover-preview-frame {max-width:700px;}
}
@media(min-width:1051px) and (max-width:1200px) {.workspace {grid-template-columns:160px minmax(0,1fr) 350px;gap:18px;}.workspace.workspace-output {grid-template-columns:150px minmax(260px,.8fr) minmax(350px,1.2fr);gap:16px;}main:has(.workspace) {padding-left:20px;padding-right:20px;}}
/* 오시는 길: 온라인 관람객 화면 전용 */
.directions-shortcut {text-align:center;padding:15px 20px 0;}
.directions-shortcut a {display:inline-block;font-size:12px;text-decoration:none;color:inherit;border:1px solid currentColor;border-radius:20px;padding:5px 14px;opacity:.75;}
.recital-directions {padding:42px 26px;text-align:center;color:inherit;}
.recital-directions>small {font-size:10px;letter-spacing:3px;opacity:.55;}
.recital-directions h3 {font-size:21px;margin:8px 0 24px;font-weight:500;}
.recital-directions h4 {font-size:16px;margin:0 0 8px;}
.recital-directions p {font-size:13px;color:inherit;white-space:pre-line;overflow-wrap:anywhere;margin:8px 0;opacity:.8;}
.directions-actions {display:flex;justify-content:center;flex-wrap:wrap;gap:8px;margin:16px 0 24px;}
.directions-actions>a,.directions-actions>button {display:inline-block;font:inherit;font-size:11px;text-decoration:none;color:inherit;background:transparent;border:1px solid currentColor;border-radius:6px;padding:7px 11px;}
.directions-note {max-width:520px;margin:24px auto 0;text-align:left;}
.directions-note>b {font-size:12px;}

/* 기존 공연 관리 공유 메뉴 안의 편집/카드 미리보기 */
.sharing-workspace {display:grid;grid-template-columns:minmax(0,1fr) 340px;gap:32px;align-items:start;}
.sharing-workspace h3 {font-size:17px;margin:0 0 12px;}
.sharing-fields {min-width:0;}
.sharing-quiet {font-size:12px;padding:7px 10px;margin-top:8px;}
.sharing-save {display:flex;flex-wrap:wrap;gap:12px;align-items:center;margin-top:25px;}
.sharing-preview {min-width:0;position:sticky;top:95px;}
.sharing-preview-tabs {display:flex;background:var(--ui-primary-soft);padding:4px;border-radius:9px;margin-bottom:14px;gap:4px;}
.sharing-preview-tabs button {flex:1;border:0;background:transparent;font-size:12px;padding:9px 5px;}
.sharing-preview-tabs button[aria-pressed="true"] {background:var(--ui-surface);color:var(--ui-primary);}
.sharing-preview-stage {background:#e9e4ed;border-radius:12px;padding:20px;}
.sharing-card {background:#fff;color:#302a38;border-radius:10px;overflow:hidden;box-shadow:0 3px 12px var(--ui-shadow);}
.sharing-card-image {display:block;width:100%;aspect-ratio:1.5;object-fit:contain;background:#f5f3f7;}
.sharing-card-auto {display:flex;align-items:center;justify-content:center;aspect-ratio:1.5;background:#f5f3f7;overflow:hidden;}
.sharing-auto-poster {width:140px;flex-shrink:0;container-type:inline-size;container-name:concert;}
.sharing-auto-poster .posterimg {display:block;width:100%;height:auto;}
.sharing-card-body {padding:14px;}
.sharing-card-body>b {font-size:14px;line-height:1.5;display:block;overflow-wrap:anywhere;}
.sharing-card-body>p {font-size:12px;color:#77717f;margin:6px 0;white-space:pre-line;overflow-wrap:anywhere;}
.sharing-card-body>small {font-size:10px;color:#8a8192;}
.sharing-card-buttons {display:flex;gap:5px;padding:0 12px 12px;}
.sharing-card-buttons>span {flex:1;text-align:center;font-size:11px;background:#f4f3f5;padding:8px 4px;border-radius:4px;}
.sharing-card-footer {border-top:1px solid #eee;padding:10px 14px;font-size:10px;color:#77717f;display:flex;justify-content:space-between;}
.sharing-address {margin-top:28px;border-top:1px solid var(--ui-border);padding-top:18px;}
.sharing-address>summary {cursor:pointer;font-weight:600;font-size:14px;margin-bottom:18px;}
@media(max-width:1200px) {.sharing-workspace {grid-template-columns:minmax(0,1fr) 300px;gap:20px;}}
@media(max-width:850px) {.sharing-workspace {grid-template-columns:minmax(0,1fr);}.sharing-preview {position:static;max-width:390px;width:100%;margin:10px auto;}.sharing-save .primary {flex:1;}.sharing-preview-stage {padding:18px;}}

/* 사진은 실제 내용 높이를 차지하고, 사진이 없는 행에는 자리를 남기지 않습니다. */
.skin .program.program-adjustable .piece>.avatar {width:var(--performer-photo-size,44px);height:var(--performer-photo-size,44px);min-width:var(--performer-photo-size,44px);flex:0 0 var(--performer-photo-size,44px);border-radius:var(--performer-photo-radius,50%);overflow:hidden;align-self:flex-start;}
.skin .program.program-adjustable .piece>.avatar img {display:block;width:100%;height:100%;object-fit:cover;}
.photo-settings {margin:12px 0;padding:12px;border:1px solid var(--ui-border);border-radius:9px;}
.photo-shape-picker {display:flex;gap:6px;flex-wrap:wrap;}
.photo-shape-picker button {padding:7px 10px;font-size:12px;}
.paper-sheet .paper-avatar {width:var(--performer-photo-size,36px);height:var(--performer-photo-size,36px);border-radius:var(--performer-photo-radius,50%);flex-shrink:0;}
.paper-sheet.paper-arrange-inline .paper-piece-body {grid-template-columns:var(--paper-name-width,60px) minmax(0,1fr);column-gap:12px;}
.paper-sheet.paper-arrange-inline.paper-focus-song .paper-piece-body {grid-template-columns:minmax(0,1fr) var(--paper-name-width,60px);}
.paper-sheet .paper-piece-body,.paper-sheet .paper-song {word-break:normal;overflow-wrap:anywhere;}
.paper-sheet .paper-name {overflow-wrap:anywhere;}
.mobile-editor-actions {display:none;}
@media(max-width:1050px) {body:has(.mobile-editor-actions) main {padding-bottom:130px;}.mobile-editor-actions {display:block;position:fixed;bottom:0;left:0;right:0;padding:8px 16px calc(10px + env(safe-area-inset-bottom));background:var(--ui-surface);border-top:1px solid var(--ui-border);box-shadow:0 -3px 16px var(--ui-shadow);z-index:10;}.mobile-editor-status {text-align:center;font-size:11px;margin-bottom:5px;}.mobile-editor-buttons {display:flex;gap:8px;max-width:600px;margin:auto;}.mobile-editor-buttons button {flex:1;min-height:44px;font-size:13px;}.mobile-editor-buttons button:disabled {opacity:.55;cursor:default;}.editor-keyboard-open .mobile-editor-actions {display:none;}.toast {bottom:calc(115px + env(safe-area-inset-bottom));}}

.paper-sheet .paper-break {margin:4px 0;padding:4px 8px;}
.paper-sheet .paper-break>small {font-size:11px;line-height:1.5;}

/* v56 — compact choices, custom color controls and mobile concert rows */
.design-block .program-palette {padding:3px;min-height:0;}
.design-block .program-palette>span {min-height:30px;padding:3px 1px;}
.performer-token {display:inline-block;white-space:nowrap;word-break:keep-all;overflow-wrap:normal;}
.paper-sheet .paper-name {overflow-wrap:normal;word-break:keep-all;}
.paper-sheet .paper-columns {gap:var(--paper-gutter,30px);}
.back-preset-grid {display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:6px;margin:8px 0 12px;}
.back-preset {padding:7px 2px;display:flex;align-items:center;justify-content:center;flex-direction:column;gap:5px;font-size:11px;}
.back-preset i {width:22px;height:22px;border-radius:50%;border:1px solid #0002;}
.back-custom {border:1px solid var(--ui-border);border-radius:8px;margin:10px 0;}
.back-custom>summary {padding:10px 12px;cursor:pointer;font-size:13px;}
.back-custom-body {padding:0 12px 14px;display:grid;grid-template-columns:42px minmax(0,1fr);gap:10px;align-items:center;}
.back-color-sample {height:42px;border-radius:8px;border:1px solid #0002;}
.back-custom-body label {margin:0;font-size:12px;min-width:0;}
.back-custom-body input[type=text] {padding:7px 10px;font:14px monospace;margin:3px 0 0;}
.back-custom-body .color-slider {grid-column:1/-1;display:grid;grid-template-columns:38px minmax(0,1fr);align-items:center;gap:8px;}
.back-custom-body input[type=range] {appearance:none;display:block;padding:0;margin:0;width:100%;height:12px;border:1px solid var(--ui-border);border-radius:8px;cursor:pointer;background:linear-gradient(90deg,#f00,#ff0,#0f0,#0ff,#00f,#f0f,#f00);}
.back-custom-body input.color-channel-1 {background:linear-gradient(90deg,#aaa,#8b48e8);}
.back-custom-body input.color-channel-2 {background:linear-gradient(90deg,#000,#888,#fff);}
.back-custom-body input[type=range]::-webkit-slider-thumb {appearance:none;width:24px;height:24px;border-radius:50%;background:#fff;border:2px solid var(--ui-primary);box-shadow:0 1px 4px #0002;}
.back-custom-body input[type=range]::-moz-range-thumb {width:20px;height:20px;border-radius:50%;background:#fff;border:2px solid var(--ui-primary);}
.paper-margin-control {margin:14px 0;}
.paper-margin-control>div {display:flex;align-items:center;gap:9px;}
.paper-margin-control button {padding:6px 11px;min-height:36px;font-size:13px;}
.paper-margin-control output {min-width:34px;text-align:center;font-size:13px;}
.paper-color-picks {display:flex;flex-wrap:wrap;gap:6px;}
.paper-color-picks button {display:flex;align-items:center;gap:5px;font-size:12px;padding:7px 9px;}
.paper-color-picks i {width:12px;height:12px;border-radius:50%;}
.concert-card-mobile-info {display:none!important;}
@media(max-width:600px){.concert-grid {grid-template-columns:minmax(0,1fr);gap:12px;}.concert-card {position:relative;display:grid;grid-template-columns:88px minmax(0,1fr);padding:12px;gap:12px;overflow:visible;}.concert-card-top.concert-card-template,.concert-card-top.concert-card-uploaded {position:static;width:88px;height:125px;aspect-ratio:210/297;align-self:start;overflow:visible;}.concert-card-visual {position:relative;overflow:hidden;border-radius:5px;}.concert-card-cover-image {position:static;width:88px;height:125px;object-fit:contain;border-radius:5px;}.concert-card-body {padding:0;min-width:0;}.concert-card-mobile-info {display:block!important;}.concert-card-body>.concert-card-uploaded-info {padding-right:22px;margin-bottom:6px;}.concert-card-uploaded-info h2 {font-size:16px;margin:3px 0;line-height:1.4;}.concert-card-body p {font-size:11px;margin:6px 0;}.concert-card-body>div:last-child {gap:5px;}.concert-card-body button {font-size:11px;padding:7px 8px;white-space:nowrap;min-height:34px;}.concert-more {right:8px;top:8px;}.concert-more>summary {width:28px;height:28px;}.concert-card .badge {font-size:10px;padding:2px 6px;}.concert-use-badge {font-size:10px;}}
@media(max-width:360px){.concert-card {grid-template-columns:68px minmax(0,1fr);gap:9px;padding:10px;}.concert-card-top.concert-card-template,.concert-card-top.concert-card-uploaded,.concert-card-cover-image {width:68px;height:96px;}.concert-card-body button {padding:7px 6px;font-size:10px;}}
.concert-more {margin:0;padding:0;border:0;}
.back-custom {padding:0;}
.paper-template-folded .paper-header {display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--paper-gutter,76px);}
.paper-face-heading {min-width:0;text-align:center;}
.paper-face-heading small {font-size:12px;}
.paper-face-heading h1 {font-family:Georgia,'Batang',serif;font-size:24px;font-weight:600;line-height:1.35;margin:4px 0;white-space:pre-line;overflow-wrap:anywhere;}
.paper-face-heading p {font-size:12px;margin:4px 0;}
.paper-template-folded .paper-part>h3 {background:var(--paper-tint,#eee8f6);}
/* 관리자 등록 표지와 카탈로그 */
.managed-cover {container-type:inline-size;position:relative;aspect-ratio:210/297;min-height:0;width:100%;padding:0;background-position:center;background-size:100% 100%;overflow:hidden;}
.managed-copy {position:absolute;left:9%;right:9%;top:10%;text-align:center;line-height:1.45;}
.managed-top-left .managed-copy {text-align:left;}
.managed-middle .managed-copy {top:50%;transform:translateY(-50%);}
.managed-bottom .managed-copy {top:auto;bottom:10%;}
.managed-cover .managed-academy {font-size:var(--managed-academy,4cqw);}
.managed-cover h2 {font-size:var(--managed-title,10cqw);line-height:1.22;margin:3cqw 0;white-space:pre-line;word-break:keep-all;overflow-wrap:anywhere;}
.managed-subtitle {font-size:3.3cqw;margin:2cqw 0;}
.managed-meta {font:var(--managed-meta,3cqw)/1.6 'Pretendard',sans-serif;margin-top:4cqw;white-space:pre-line;}
.template-current {display:flex;flex-wrap:wrap;align-items:center;gap:5px 10px;padding:10px 0;font-size:12px;}
.template-current span,.template-current small {color:var(--ui-muted);}
.template-filters {display:flex;gap:6px;overflow:auto;margin-bottom:12px;padding:2px;}
.template-filters button {white-space:nowrap;font-size:12px;padding:6px 10px;}
.template-more {width:100%;font-size:13px;margin:10px 0;}
.template-manager-grid {display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;}
.template-manager-card {display:grid;grid-template-columns:70px minmax(0,1fr);gap:12px;padding:14px;border:1px solid var(--ui-border);border-radius:10px;}
.template-manager-card>img {width:70px;aspect-ratio:210/297;object-fit:contain;}
.template-manager-card h3 {font-size:15px;margin:0 0 5px;overflow-wrap:anywhere;}
.template-manager-card p {font-size:12px;color:var(--ui-muted);margin:4px 0;}
.template-card-actions {display:flex;flex-wrap:wrap;gap:6px;margin-top:10px;}
.template-card-actions button {padding:6px 8px;font-size:12px;}
.template-dialog {width:calc(100% - 32px);max-width:920px;max-height:90dvh;padding:0;border:1px solid var(--ui-border);border-radius:14px;background:var(--ui-surface);color:var(--ui-text);}
.template-dialog::backdrop {background:#20152c77;}
.template-dialog-heading {position:sticky;top:0;z-index:2;display:flex;justify-content:space-between;align-items:center;padding:15px 22px;border-bottom:1px solid var(--ui-border);background:var(--ui-surface);}
.template-dialog-heading h2 {font-size:20px;margin:0;}
.template-form-grid {display:grid;grid-template-columns:minmax(0,1fr) minmax(240px,.8fr);gap:26px;padding:22px;}
.template-fields {min-width:0;}
.template-field-pair {display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;}
.template-field-triple {display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;}
.template-fields label,.template-preview-panel label {font-size:13px;}
.template-fields input,.template-fields select,.template-preview-panel textarea {margin-top:5px;}
.template-preview-panel {align-self:start;position:sticky;top:70px;min-width:0;}
.template-preview-panel .skin {width:100%;max-width:320px;margin:auto;}
.template-upload-empty {aspect-ratio:210/297;display:grid;place-content:center;text-align:center;border:1px dashed var(--ui-border);color:var(--ui-muted);background:var(--ui-quiet-surface);font-size:14px;}
@media(max-width:1100px){.template-manager-grid {grid-template-columns:repeat(2,minmax(0,1fr));}}
@media(max-width:640px){.template-manager-grid {grid-template-columns:1fr;}.template-form-grid {grid-template-columns:1fr;padding:16px;gap:20px;}.template-preview-panel {position:static;}.template-dialog-heading {padding:12px 16px;}.template-field-triple {gap:6px;}.template-fields input {padding:10px 8px;}}

.server-audience{max-width:550px;margin:0 auto;background:#fff}.server-link{display:inline-block;margin:12px 0;color:var(--ui-primary)}

/* 서버 v2 · 표지 선택과 접힌 설정 */
.theme-grid {grid-template-columns:repeat(5,minmax(0,1fr));}
.design-details:not([open])>.design-details-body {display:none;}
.design-details:not([open]) {padding:0;}
.design-details:not([open])>summary {margin:0;padding:14px;}
@media(max-width:768px){.theme-grid {grid-template-columns:repeat(3,minmax(0,1fr));}}