*{box-sizing:border-box}html,body,#root{width:100%;height:100%;margin:0}body{font-family:Inter,Arial,sans-serif}.app{box-sizing:border-box;color:#e9edf3;background:radial-gradient(circle at top,#24262b 0%,#0f1115 45%);flex-direction:column;gap:12px;height:100vh;padding:16px;display:flex}.topbar{flex-direction:column;justify-content:center;align-items:center;gap:12px;display:flex}.topbar h1{color:#e5e7eb;margin:0;font-size:1.35rem}.app-title-heading{justify-content:center;align-items:center;gap:10px;display:flex}.app-title-icon{object-fit:contain;flex-shrink:0;width:32px;height:32px;display:block}.topbar .app-title-link{font:inherit;color:inherit;cursor:pointer;background:0 0;border:none;margin:0;padding:0}.topbar .app-title-link:hover{text-underline-offset:4px;text-decoration:underline}.toolbar{justify-content:center;gap:8px;display:flex}.toolbar button{padding:10px 16px;font-size:1rem}.close-project-btn{background:linear-gradient(#6e2323 0%,#591c1c 100%);border-color:#8b2e2e}.close-project-btn:hover:not(:disabled){border-color:#ff6a6a}.export-btn-active{background:linear-gradient(#2f6fbe 0%,#275e9f 100%);border-color:#2f6fbe}.export-btn-active:hover:not(:disabled){border-color:#66b3ff}button{color:#e9edf3;cursor:pointer;background:linear-gradient(#2b2f36 0%,#23272e 100%);border:1px solid #3a3f47;border-radius:8px;padding:8px 12px}button:hover:not(:disabled){border-color:#4ea3ff}button:disabled{opacity:.5;cursor:not-allowed}.status{color:#b6bcc7;margin:0}.workspace{flex:1;grid-template-columns:320px 1fr;gap:12px;min-height:0;display:grid}.workspace-single{grid-template-columns:1fr}.about-page{background:#1b1f25;border:1px solid #2d3440;border-radius:10px;flex:1;min-height:0;padding:16px;overflow:auto}.about-page h2{margin:0 0 10px}.about-page h2:not(:first-child){margin-top:20px}.about-page p{color:#a8adb7;margin:0 0 12px}.license-list{gap:8px;margin:0;padding-left:18px;display:grid}.license-list a{color:#8fb1ff}.sidebar{background:#1a1e24;border:1px solid #3b414b;border-radius:10px;flex-direction:column;gap:8px;min-height:0;padding:10px;display:flex}.undo-row button,.insert-btn{width:100%;padding:6px 0;font-size:1.6rem;line-height:1}.thumb-list{flex-direction:column;gap:8px;min-height:0;display:flex;overflow:auto}.thumb-item{background:#242931;border:1px solid #3d4450;border-radius:8px;flex-direction:column;gap:8px;padding:8px;display:flex}.thumb-item.selected{border-color:#4ea3ff;box-shadow:0 0 0 1px #4ea3ff33}.thumb-select{text-align:left;color:#e9edf3;cursor:grab;background:0 0;border:0;flex-direction:column;gap:6px;padding:0;display:flex}.thumb-image-frame{background:#151920;border-radius:4px;justify-content:center;align-items:center;width:100%;height:160px;display:flex;overflow:hidden}.thumb-image{object-fit:contain;transform-origin:50%;max-width:100%;max-height:100%}.thumb-actions{gap:8px;display:flex}.thumb-actions button{flex:1;justify-content:center;align-items:center;padding:4px 8px;font-size:1.5rem;line-height:1;display:inline-flex}.thumb-actions button.drag-handle{font-size:1.3rem;line-height:1}.preview-pane,.preview-empty{background:#1a1e24;border:1px solid #3b414b;border-radius:10px;flex-direction:column;min-height:0;padding:16px;display:flex}.preview-empty{color:#a4aab5;justify-content:center;align-items:center}.preview-empty-clickable{cursor:pointer}.preview-empty-clickable:hover,.preview-pane.drag-active,.preview-empty.drag-active{background:#253140;border-color:#4ea3ff}.empty-open-btn{margin:0;padding:12px 16px;font-size:1rem}.empty-help{color:#b7bdc8;margin:10px 0 0}.preview-meta{color:#a8adb7;justify-content:space-between;align-items:center;gap:8px;display:flex}.preview-controls{align-items:center;gap:8px;display:flex}.preview-controls-bottom{justify-content:center;margin-top:12px}.preview-controls button{min-width:36px;padding:6px 10px}.preview-zoom{text-align:center;min-width:56px}.preview-page-wrap{flex:1;justify-content:center;align-items:center;min-height:0;display:flex;overflow:auto}.preview-page{object-fit:contain;transform-origin:50%;background:#151920;border-radius:8px;width:100%;height:100%}.footer-links{justify-content:center;gap:12px;display:flex}.footer-link{color:#a4aab5;background:0 0;border:0;padding:4px 6px;text-decoration:underline}.footer-link.active{color:#9ed1ff}
