:root{font-family:Segoe UI,Arial,sans-serif;line-height:1.5;font-weight:400;color:#111827;background:#e5e7eb;font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}*{box-sizing:border-box}body{margin:0;min-width:1280px;background:#e5e7eb}button,input{font:inherit}button{cursor:pointer;border:1px solid #d1d5db;background:#fff;color:#111827;border-radius:6px;padding:6px 12px;font-size:13px;font-weight:500;transition:all .15s ease;box-shadow:0 1px 2px #0000000d}button:hover:not(:disabled){border-color:#bd1a1a;color:#bd1a1a;background:#fff5f5}button:disabled{cursor:not-allowed;opacity:.45;box-shadow:none}.secondary{background:#f9fafb}.primary-button{background:#bd1a1a;color:#fff;border-color:#bd1a1a}.primary-button:hover:not(:disabled){color:#fff;background:#9b1515;border-color:#9b1515}input{width:100%;border:1px solid #d1d5db;border-radius:10px;padding:10px 12px;background:#fff}.app-shell{min-height:100vh;padding:20px}.app-header{border-bottom:1px solid #d1d5db;padding-bottom:12px;margin-bottom:24px}.app-header h1{margin:0;font-size:24px;font-weight:700;color:#bd1a1a;letter-spacing:-.5px;display:flex;align-items:baseline}.app-subtitle{font-size:14px;font-weight:500;color:#4b5563;margin-left:8px;opacity:.8}.workspace-grid{display:grid;grid-template-columns:360px 1fr;gap:16px;align-items:start}.left-column,.center-column,.right-column{display:flex;flex-direction:column;gap:16px}.panel{background:#fffffff0;border:1px solid #d1d5db;border-radius:18px;padding:16px;box-shadow:0 16px 32px #0f172a0f}.section-header{display:flex;justify-content:space-between;gap:12px;align-items:center;margin-bottom:12px}.section-header h2,.upload-dropzone h2{margin:0;font-size:18px}.section-header span,.upload-meta,.logo-block p,.upload-dropzone p{color:#6b7280;font-size:13px}.upload-dropzone{border:2px dashed #d1d5db;border-radius:16px;padding:18px;background:#fafafa}.upload-dropzone.is-dragover{border-color:#bd1a1a;background:#fff5f5}.upload-actions,.thumbnail-actions,.action-stack{display:flex;gap:8px;flex-wrap:wrap}.form-block{display:grid;gap:12px;margin-top:16px}.form-block label{display:grid;gap:6px}.form-block span,.logo-block h3{font-size:14px;font-weight:600}.logo-block{display:grid;gap:12px;margin:16px 0}.logo-block h3{margin:0}.logo-preview{max-width:180px;max-height:56px;object-fit:contain;background:#fff;border:1px solid #e5e7eb;border-radius:10px;padding:8px}.thumbnail-grid{display:grid;gap:12px;max-height:calc(100vh - 380px);overflow:auto}.thumbnail-card{border:1px solid #e5e7eb;border-radius:14px;overflow:hidden;background:#fff}.thumbnail-card.is-main{border-color:#991b1b;box-shadow:inset 0 0 0 1px #991b1b1f}.thumbnail-image-wrapper{position:relative;height:132px;background:#f3f4f6}.thumbnail-image{width:100%;height:100%;object-fit:cover}.thumbnail-index,.thumbnail-badge,.slot-label{position:absolute;border-radius:999px;padding:4px 8px;font-size:12px;color:#fff;background:#111827bf}.thumbnail-index{top:8px;left:8px}.thumbnail-badge{top:8px;right:8px;background:#991b1be6}.thumbnail-body{display:grid;gap:4px;padding:12px}.thumbnail-body strong,.thumbnail-body span,.thumbnail-body em{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.thumbnail-body span,.thumbnail-body em{font-size:12px;color:#6b7280}.thumbnail-body em{color:#bd1a1a;font-style:normal}.thumbnail-actions{padding:0 12px 12px}.preview-panel{min-height:100%}.page-preview{background:#d1d5db;border-radius:16px;padding:16px}.page-preview-inner{position:relative;width:100%;aspect-ratio:418 / 295;background:#fff;overflow:hidden;border-radius:8px}.preview-slot{position:absolute;overflow:hidden;border:1px solid transparent;padding:0;border-radius:0;background:#f3f4f6;cursor:grab}.preview-slot.is-selected{border-color:#2563eb;box-shadow:inset 0 0 0 2px #2563eba6}.preview-slot.is-swap-source{border-color:#bd1a1a;box-shadow:inset 0 0 0 2px #bd1a1aa6}.preview-slot.is-dragging{opacity:.72;cursor:grabbing;border-color:#bd1a1a;box-shadow:inset 0 0 0 2px #bd1a1a73}.preview-image{width:100%;height:100%;object-fit:cover;display:block}.preview-placeholder{display:grid;place-items:center;width:100%;height:100%;color:#6b7280;font-size:13px}.slot-label{left:8px;bottom:8px}.preview-footer{position:absolute;left:0;right:0;bottom:0;display:grid;grid-template-columns:1.4fr 1.5fr .9fr;align-items:center;background:transparent;color:#111827;font-weight:500}.footer-cell{min-width:0;padding:0 24px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.footer-center{text-align:center}.footer-right{display:flex;justify-content:flex-end;align-items:center}.footer-logo{max-width:100%;max-height:54px;object-fit:contain}.status-list{display:grid;gap:12px}.status-list div{display:grid;gap:4px;padding-bottom:10px;border-bottom:1px solid #e5e7eb}.status-list strong{font-size:14px}.status-list span{color:#4b5563;font-size:14px}.action-stack{margin-top:16px}.issue-list{margin-top:16px;border-top:1px solid #e5e7eb;padding-top:16px}.issue-list h3{margin:0 0 8px;font-size:16px}.issue-list p,.issue-list li{color:#4b5563;font-size:14px}.preview-empty-state{display:flex;align-items:center;justify-content:center;width:100%;height:100%;background:#f8fafc;border:1px dashed #cbd5e1;border-radius:8px;padding:40px}.preview-empty-text{text-align:center;max-width:320px}.preview-empty-text h3{margin:0 0 8px;font-size:18px;color:#334155}.preview-empty-text p{margin:0;font-size:14px;color:#64748b;line-height:1.6}.status-toast{display:inline-flex;align-items:center;gap:8px;margin-top:16px;padding:8px 14px;background:#fff;border:1px solid #d1d5db;border-radius:6px;color:#374151;font-size:13px;font-weight:500;box-shadow:0 4px 6px -1px #0000000d,0 2px 4px -1px #00000008;animation:slideUp .2s ease-out}.status-indicator{display:inline-block;width:6px;height:6px;background-color:#bd1a1a;border-radius:50%;box-shadow:0 0 0 2px #bd1a1a40;animation:pulse 1.5s infinite ease-in-out}.upload-issues-block{margin-top:12px;border-top:1px solid #e5e7eb;padding-top:12px;text-align:left}.upload-issues-block h4{margin:0 0 6px;font-size:13px;color:#bd1a1a}.upload-issues-block ul{margin:0;padding-left:18px;font-size:12px;color:#4b5563}@keyframes pulse{0%,to{transform:scale(1);opacity:1}50%{transform:scale(1.3);opacity:.5}}@keyframes slideUp{0%{opacity:0;transform:translateY(4px)}to{opacity:1;transform:translateY(0)}}.page-tabs-bar{margin-bottom:12px;background:#ffffffe6;padding:6px 12px;border:1px solid #d1d5db;border-radius:12px;box-shadow:0 4px 6px -1px #00000008}.tabs-container{display:flex;align-items:center;gap:8px;flex-wrap:wrap}.page-tab-item{display:inline-flex;align-items:center;gap:8px;padding:6px 12px;background:#f3f4f6;border:1px solid #e5e7eb;border-radius:8px;cursor:pointer;font-size:13px;font-weight:500;color:#4b5563;transition:all .2s ease-in-out;-webkit-user-select:none;user-select:none}.page-tab-item:hover{background:#e5e7eb;color:#1f2937}.page-tab-item.is-active{background:#bd1a1a;border-color:#bd1a1a;color:#fff;box-shadow:0 2px 4px #bd1a1a26}.delete-tab-btn{background:transparent;border:none;color:inherit;font-size:16px;cursor:pointer;padding:0 4px;line-height:1;border-radius:50%;transition:background .15s;display:flex;align-items:center;justify-content:center}.delete-tab-btn:hover{background:#0000001a}.page-tab-item.is-active .delete-tab-btn:hover{background:#fff3}.add-page-tab-btn{padding:6px 12px;background:transparent;border:1px dashed #9ca3af;border-radius:8px;color:#4b5563;cursor:pointer;font-size:13px;font-weight:500;transition:all .15s}.add-page-tab-btn:hover{border-color:#bd1a1a;color:#bd1a1a;background:#bd1a1a05}
