:root{font-family:system-ui,Avenir,Helvetica,Arial,sans-serif;line-height:1.5;font-weight:400;color-scheme:light dark;color:#ffffffde;background-color:#242424;font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}a{font-weight:500;color:#646cff;text-decoration:inherit}a:hover{color:#535bf2}body{margin:0;display:flex;place-items:center;min-width:320px;min-height:100vh}h1{font-size:3.2em;line-height:1.1}button{border-radius:8px;border:1px solid transparent;padding:.6em 1.2em;font-size:1em;font-weight:500;font-family:inherit;background-color:#1a1a1a;cursor:pointer;transition:border-color .25s}button:hover{border-color:#646cff}button:focus,button:focus-visible{outline:4px auto -webkit-focus-ring-color}@media(prefers-color-scheme:light){:root{color:#213547;background-color:#fff}a:hover{color:#747bff}button{background-color:#f9f9f9}}:root{color-scheme:dark;--bg: #050608;--panel: #0b0f18;--border: #1c2434;--text: #ffffff;--muted: #b7bed3;--primary: #0f4fdc;--danger: #ef4444;--shadow: 0 10px 30px rgba(0, 0, 0, .35);font-family:Paperlogy,Noto Sans KR,sans-serif}@font-face{font-family:Aggro;src:url(/fonts/SB-Aggro-L.ttf) format("truetype");font-weight:300;font-style:normal;font-display:swap}@font-face{font-family:Aggro;src:url(/fonts/SB-Aggro-M.ttf) format("truetype");font-weight:500;font-style:normal;font-display:swap}@font-face{font-family:Aggro;src:url(/fonts/SB-Aggro-B.ttf) format("truetype");font-weight:700;font-style:normal;font-display:swap}@font-face{font-family:Paperlogy;src:url(/fonts/Paperlogy-5Medium.ttf) format("truetype");font-weight:500;font-style:normal;font-display:swap}*{box-sizing:border-box}html,body{margin:0;min-height:100%;overflow:auto;background:var(--bg);color:var(--text);font-family:Paperlogy,Noto Sans KR,sans-serif}.app{min-height:100vh;display:flex;flex-direction:column}.toolbar{display:flex;align-items:center;justify-content:space-between;padding:12px 16px;background:#070a12;border-bottom:1px solid var(--border);position:sticky;top:0;z-index:10}.toolbar-left{display:flex;align-items:center;gap:10px}.toolbar-title{font-weight:700}.pill{padding:4px 8px;border:1px solid var(--border);border-radius:999px;font-size:12px;color:var(--muted)}.toolbar-actions{display:flex;gap:8px}.btn{border:none;cursor:pointer;border-radius:6px;font-weight:700;color:var(--text);padding:7px 10px;transition:opacity .15s ease;font-family:Paperlogy,Noto Sans KR,sans-serif;font-size:12px}.btn:disabled{opacity:.5;cursor:not-allowed}.btn.primary{background:var(--primary)}.btn.secondary{background:#1b2233;color:var(--text)}.link{border:none;background:transparent;color:var(--text);cursor:pointer;padding:0}.link.danger{color:var(--danger)}.content{padding:16px;display:flex;flex-direction:column;gap:16px;flex:1;min-height:0;overflow:visible;background:var(--bg)}.canvas-strip-wrap{position:relative;flex:1;min-height:0;overflow:visible}.strip-btn{position:absolute;top:50%;transform:translateY(-50%);z-index:5;background:#00000080;color:#fff;border:1px solid rgba(255,255,255,.2);border-radius:50%;width:36px;height:36px;display:flex;align-items:center;justify-content:center;cursor:pointer}.strip-btn.left{left:6px}.strip-btn.right{right:6px}.strip-btn.mobile-only{display:none}.strip-btn.disabled{opacity:.28;pointer-events:none}.canvas-strip{display:flex;flex-wrap:wrap;gap:10px;align-items:flex-start;overflow-x:auto;overflow-y:auto;padding-bottom:8px;-webkit-overflow-scrolling:touch;scroll-behavior:smooth;height:100%}.upload-card{flex:0 0 100%;flex-shrink:0;width:100%;box-sizing:border-box;background:#0b0f18;border:1px solid var(--border);border-radius:10px;padding:10px;display:flex;flex-direction:column;gap:8px;scroll-snap-align:start}.strip-controls{display:none;gap:8px;margin:0 4px 8px}.mobile-only{display:none}.upload-title{font-weight:700;font-size:14px}.canvas-card{flex:0 0 auto;flex-shrink:0;width:clamp(230px,28vw,320px)}.canvas{position:relative;width:100%;aspect-ratio:3 / 4;border:none;border-radius:0;overflow:hidden;background:#000;box-shadow:none}.frame-embed{width:100%;height:100%;border:none;display:block;background:#000}.controls{display:flex;flex-direction:column;gap:6px;margin-top:6px;background:#0b0f18;border:1px solid var(--border);border-radius:10px;padding:8px}.field{display:flex;flex-direction:column;gap:6px}.row{display:flex;gap:8px;align-items:center}.row.between{justify-content:space-between}.row.gap{gap:6px}.grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:12px}label{font-size:12px;color:var(--muted)}input,textarea{background:#101524;border:1px solid var(--border);border-radius:6px;padding:8px 10px;color:var(--text);font-size:14px;font-family:Paperlogy,Noto Sans KR,sans-serif;width:100%}textarea{resize:vertical}.chips{display:flex;flex-wrap:wrap;gap:6px}.chip{border:1px solid var(--border);background:#111828;color:var(--text);padding:4px 8px;border-radius:6px;cursor:pointer}.chip.active{background:var(--primary);border-color:var(--primary)}.subcard{border:1px solid var(--border);border-radius:8px;padding:10px;background:#0d121f;display:flex;flex-direction:column;gap:8px}.draggable{cursor:grab}.dragging{outline:1px dashed var(--primary);background:#111a2a}.upload-row{display:flex;align-items:center;gap:8px}.upload-info .value{color:var(--muted);font-size:12px}.flex1{flex:1}.progress{display:flex;align-items:center;gap:8px;padding:8px 16px}.progress-track{flex:1;height:10px;background:#0f1624;border-radius:999px;overflow:hidden}.progress-fill{height:100%;background:var(--primary)}.progress-text{min-width:40px;text-align:right}.page{width:100%;height:100%;position:relative;background-size:cover;background-position:center;font-family:Aggro,Paperlogy,sans-serif}.page1 .section-bottom{position:absolute;bottom:16px;left:16px;right:16px;display:flex;justify-content:space-between;align-items:center;color:#fff;font-family:Paperlogy,sans-serif}.page1 .date{font-size:calc(var(--vh, 1vh) * 4.2);font-weight:500}.page1 .number{font-size:calc(var(--vh, 1vh) * 1.5);font-weight:400}.page1 .desc{font-size:calc(var(--vh, 1vh) * 2)}.right{text-align:right}.overlay{position:absolute;inset:0;background:linear-gradient(90deg,#00000073,#0000001f)}.page2 .content,.page3 .content,.page4 .content{position:relative;z-index:1;padding:calc(var(--vh, 1vh) * 7);height:100%;display:flex;flex-direction:column;gap:calc(var(--vh, 1vh) * 4)}.header img{width:calc(var(--vh, 1vh) * 10);filter:drop-shadow(0 calc(var(--vh, 1vh) * .4) calc(var(--vh, 1vh) * 1) rgba(0,0,0,.1))}.header{display:flex;align-items:flex-start;gap:calc(var(--vh, 1vh) * 1.8);margin-top:calc(var(--vh, 1vh) * 1)}.order-list{list-style:none;padding:0;margin:calc(var(--vh, 1vh) * 2) 0 0;display:flex;flex-direction:column;gap:calc(var(--vh, 1vh) * 2.4)}.order-item{display:grid;grid-template-columns:auto 1fr;column-gap:calc(var(--vh, 1vh) * 2);row-gap:calc(var(--vh, 1vh) * .8);align-items:start;margin-bottom:calc(var(--vh, 1vh) * 2);color:#f7f7f7}.order-item .num{font-size:calc(var(--vh, 1vh) * 5.5);font-weight:500;min-width:calc(var(--vh, 1vh) * 6);text-align:center}.primary{display:flex;gap:calc(var(--vh, 1vh) * 2);font-size:calc(var(--vh, 1vh) * 2.6);font-weight:500;line-height:1.2}.meta{color:#d7d7d7;font-weight:300;font-size:calc(var(--vh, 1vh) * 1.8)}.secondary{color:#d7d7d7;font-size:calc(var(--vh, 1vh) * 1.8)}.song-list{list-style:none;padding:0;margin:calc(var(--vh, 1vh) * 3.2) 0;display:flex;flex-direction:column;gap:var(--song-gap, 20px);flex:1;justify-content:center;margin-bottom:calc(var(--vh, 1vh) * 15)}.song-item{max-width:80%}.song-item.left{text-align:left}.song-item.right{align-self:flex-end;text-align:right}.song-item .meta{font-size:calc(var(--vh, 1vh) * 2)}.song-item .title{font-size:calc(var(--vh, 1vh) * 3.5);font-weight:600}.song-item .lines{color:#d7d7d7;font-size:calc(var(--vh, 1vh) * 1.6);line-height:1.45}.footer{margin-top:auto;font-size:calc(var(--vh, 1vh) * 3.8);font-weight:300;align-self:flex-end}.question-list{list-style:none;padding:0;margin:calc(var(--vh, 1vh) * 2) 0;display:flex;flex-direction:column;gap:7vh}.q-item{display:grid;grid-template-columns:auto 1fr;gap:8px;align-items:start}.q-item .num{font-weight:700;font-size:calc(var(--vh, 1vh) * 2.6);color:#1e3b78}.hymn-input{min-width:110px}.page4 .primary{font-size:calc(var(--vh, 1vh) * 1.9);font-weight:300;line-height:1.35}@media(max-width:1080px){.content{flex-direction:column;padding:0;overflow:visible}.canvas-strip{flex-wrap:nowrap;gap:0;overflow-x:auto;scroll-snap-type:x mandatory;padding:0;overscroll-behavior-x:contain}.canvas-card,.upload-card{width:100vw;max-width:100vw;scroll-snap-align:start;scroll-snap-stop:always;padding:0;box-sizing:border-box;max-height:calc(100vh - 70px);overflow-y:auto;-webkit-overflow-scrolling:touch}.strip-btn.mobile-only{display:flex}.controls{gap:6px;padding:6px}.canvas{height:auto;aspect-ratio:3 / 4;border-radius:10px}.btn{padding:5px 8px;font-size:11px}input,textarea{padding:6px 8px;font-size:12.5px}}