@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+KR:wght@400;600;700;800&display=swap');
[hidden]{display:none!important}
*{box-sizing:border-box}body{margin:0;background:#f4f6f9;color:#0c1830;font-family:'Noto Sans KR',sans-serif}header{height:70px;background:#fff;border-bottom:1px solid #e1e6ee;display:flex;align-items:center;gap:14px;padding:0 max(18px,calc((100% - 980px)/2))}header b{font-size:17px}header span{color:#6b7890;font-size:12px}main{max-width:980px;margin:auto;padding:54px 18px 100px}.hero{margin:0 0 36px}.hero p,.number{color:#2765ff;font-size:11px;font-weight:800;letter-spacing:.16em}.hero h1{font-size:42px;letter-spacing:-.055em;line-height:1.2;margin:10px 0 25px}.progress{height:5px;background:#dde4ed;border-radius:5px}.progress i{display:block;width:25%;height:100%;background:#2765ff;border-radius:5px;transition:.3s}.panel{background:#fff;border:1px solid #e0e6ef;border-radius:22px;padding:34px;box-shadow:0 14px 45px #1525410c}.panel h2{margin:6px 0 7px;font-size:24px;letter-spacing:-.04em}.panel>p{margin:0 0 24px;color:#66748b;font-size:13px;line-height:1.65}input[type=file]{width:100%;border:2px dashed #bfd0ed;border-radius:14px;padding:24px;background:#f9fbff}.previews{display:grid;grid-template-columns:repeat(5,1fr);gap:10px;margin-top:18px}.previews img{width:100%;aspect-ratio:1/1.25;object-fit:cover;border-radius:9px;border:1px solid #e2e7ef}button{border:0;border-radius:12px;background:#2864f8;color:#fff;font:700 13px inherit;padding:14px 19px;cursor:pointer;margin-top:24px}button:disabled{background:#cbd3df;cursor:not-allowed}.secondary{background:#eaf0f8;color:#15253c}.row{display:flex;justify-content:space-between;gap:12px}textarea{width:100%;resize:vertical;border:1px solid #ced8e5;border-radius:14px;padding:16px;font:14px/1.7 inherit;color:#14233a}.choices{display:grid;grid-template-columns:1fr 1fr;gap:14px}.choice{margin:0;min-height:145px;background:#fff;color:#17263e;border:1px solid #d5dee9;text-align:left;display:flex;flex-direction:column;gap:7px;padding:20px}.choice b{font-size:25px;color:#2765ff}.choice strong{font-size:17px}.choice small{color:#6a7890}.choice.selected{border:2px solid #2864f8;background:#f6f8ff;padding:19px}.choice.unavailable{opacity:.58;background:#f7f8fa;cursor:not-allowed}.choice .status{display:inline-block;width:max-content;padding:4px 7px;border-radius:6px;background:#eef7ef;color:#28713b;font-size:10px;font-weight:800}.choice .status.needs-setup{background:#fff1dd;color:#995a10}.confirm{display:flex;gap:9px;margin-top:24px;color:#47566c;font-size:13px;line-height:1.5}.danger{background:#d3354c;width:100%}#alert,#result{margin:0 0 16px;padding:14px 17px;border-radius:12px;font-size:13px}#alert{background:#fff4e8;color:#824d11;border:1px solid #f0cfaa}#result{margin-top:17px;background:#eef8f0;color:#275e34;border:1px solid #cbe7d2}.setup-help{margin-top:16px;padding:14px 16px;border:1px solid #f0cfaa;border-radius:12px;background:#fff7ec;color:#76450f;font-size:12px;line-height:1.65;white-space:pre-line}@media(max-width:650px){.hero h1{font-size:34px}.panel{padding:23px}.previews{grid-template-columns:repeat(3,1fr)}.choices{grid-template-columns:1fr}.row{flex-direction:column}.row button{width:100%}}
.login-screen{min-height:100vh;display:grid;place-items:center;padding:24px}.login-screen[hidden]{display:none}.login-card{width:min(100%,420px);padding:30px;border:1px solid #dfe6ef;border-radius:20px;background:#fff;box-shadow:0 20px 60px #15254118}.login-card p{margin:0;color:#2765ff;font-size:11px;font-weight:800;letter-spacing:.16em}.login-card h1{margin:8px 0 24px}.login-card label{display:block;margin-bottom:8px;font-size:13px;font-weight:700}.login-card input{width:100%;min-height:48px;padding:12px;border:1px solid #cbd6e4;border-radius:11px;font:16px inherit}.login-card button{width:100%;margin-top:14px}.login-card small{display:block;min-height:20px;margin-top:12px;color:#b4233b}.header-button{margin:0 0 0 auto;padding:8px 11px;background:#eaf0f8;color:#334862;font-size:11px}
/* Completion choices shown only after a successful upload. */
.music-options{margin:18px 0;padding:16px;border:1px solid #cbd5e1;border-radius:12px;background:#f8fafc}.music-options h3{margin:0 0 10px}.music-limit{margin:12px 0 6px;padding:12px;border-radius:8px;background:#fff7ed;color:#7c2d12;line-height:1.65}
#result p,#quick-result p{margin:8px 0 0;color:#42714d;line-height:1.55}
.previews{grid-template-columns:repeat(5,minmax(0,1fr))}
.previews figure{min-width:0;margin:0}
.previews img{display:block;aspect-ratio:4/5;object-fit:contain;background:#eef2f7}
.previews figcaption{padding:7px 2px 0;color:#34445d;font-size:11px;font-weight:700;line-height:1.35;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.preview-controls{display:grid;grid-template-columns:1fr 1fr;gap:5px;margin-top:7px}.preview-controls button{min-height:34px;margin:0;padding:6px;border-radius:8px;background:#e8eef7;color:#27405f;font-size:12px;touch-action:manipulation}.preview-controls .remove-card{grid-column:1/-1;background:#fff0f2;color:#a9273b}.server-previews{display:flex;gap:8px;overflow-x:auto;margin:0 0 14px;padding:3px 0 9px;scroll-snap-type:x mandatory}.server-previews figure{flex:0 0 92px;margin:0;scroll-snap-align:start}.server-previews img{display:block;width:92px;aspect-ratio:4/5;object-fit:contain;border:1px solid #dce4ee;border-radius:8px;background:#eef2f7}.server-previews figcaption{text-align:center}.plan-item>div:first-child{display:flex;flex-direction:column;gap:3px}.plan-previews{display:flex;gap:5px;overflow-x:auto}.plan-previews img{width:42px;height:52px;flex:0 0 auto;object-fit:contain;border:1px solid #dce4ee;border-radius:5px;background:#eef2f7}
.result-actions{margin-top:3px}
.result-actions button{margin-top:14px}
.choice[data-format]{cursor:pointer}
.choice[data-format] input{align-self:flex-end;accent-color:#2864f8;width:18px;height:18px;margin:0}
.account-upload{margin:0 0 18px;padding:22px;border:1px solid #dfe7f1;border-radius:16px;background:#fbfcff}.account-upload h3{margin:0 0 5px;font-size:19px;letter-spacing:-.035em}.account-upload h3 small{margin-left:7px;color:#28713b;font-size:11px;font-weight:800}.account-upload.unavailable h3 small{color:#995a10}.account-upload>p{margin:0 0 14px;color:#66748b;font-size:13px}.account-upload.unavailable{background:#fffaf3;border-color:#f0dfc5}
.sets-container{display:grid;gap:13px}.upload-set{padding:17px;border:1px solid #dce5f1;border-left:4px solid #2864f8;border-radius:14px;background:#fff}.set-heading{display:flex;align-items:center;justify-content:space-between;gap:12px}.set-heading h4{margin:0;color:#17263e;font-size:16px}.remove-set{margin:0;padding:7px 10px;background:#fff0f2;color:#b4233b;font-size:10px}.format-checks{display:grid;grid-template-columns:1fr 1fr;gap:9px;margin:13px 0 8px}.format-checks label{display:flex;align-items:center;gap:7px;padding:11px 12px;border:1px solid #d7e0ec;border-radius:10px;background:#f8fafc;color:#526177;font-size:12px;font-weight:700;cursor:pointer}.format-checks label.selected{border-color:#2864f8;background:#edf3ff;color:#174ebf}.format-checks input{accent-color:#2864f8}.set-help{margin:0 0 11px;color:#748198;font-size:11px}.upload-set input[type=file]{padding:16px}.upload-set .previews{margin-top:13px}.add-set{width:100%;margin-top:12px;border:1px dashed #9eb5d7;background:#f1f5fb}.caption-card{margin:0 0 18px;padding:18px;border:1px solid #dfe7f1;border-radius:14px;background:#fbfcff}.caption-card h3{margin:0 0 5px}.caption-card p{margin:0 0 12px;color:#66748b;font-size:12px}.format-badge{display:inline-block;margin-left:7px;padding:3px 7px;border-radius:6px;background:#eaf0ff;color:#2454c6;font-size:10px;vertical-align:middle}.publish-plan{display:grid;gap:9px}.plan-item{display:flex;justify-content:space-between;gap:12px;padding:13px 15px;border:1px solid #dce5f1;border-radius:11px;background:#f8faff;font-size:13px}.plan-item b{color:#17263e}.plan-item span{color:#66748b}
@media(max-width:750px){.format-checks{grid-template-columns:1fr}.plan-item{flex-direction:column;gap:9px}.previews{grid-template-columns:repeat(2,minmax(0,1fr))}.preview-controls button{min-height:40px}}
.first-actions{display:grid;grid-template-columns:1fr 1fr;gap:12px}.first-actions button{width:100%}.quick-note{margin:10px 0 0!important;color:#a33a49!important;font-size:11px!important}.first-actions .danger{background:#d3354c}#quick-result{margin-top:17px;padding:14px 17px;border-radius:12px;background:#eef8f0;color:#275e34;border:1px solid #cbe7d2;font-size:13px}#quick-result button{margin-top:14px}@media(max-width:650px){.first-actions{grid-template-columns:1fr}}