.app.svelte-b7bqwh{display:flex;flex-direction:column;height:100vh;overflow:hidden}.drop-overlay.svelte-b7bqwh{position:fixed;inset:0;z-index:999;background:#ffffffd9;display:flex;align-items:center;justify-content:center;pointer-events:none}.drop-overlay-content.svelte-b7bqwh{display:flex;flex-direction:column;align-items:center;gap:12px;color:var(--color-gray-500, #6b7280);font-size:1rem;font-weight:500;padding:40px 60px;border:2px dashed var(--color-gray-300, #d1d5db);border-radius:16px;background:var(--color-gray-50, #f9fafb)}.loading-overlay.svelte-b7bqwh{position:fixed;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:16px;background:var(--color-white);z-index:9999;transition:opacity .3s ease}.loading-overlay.hidden.svelte-b7bqwh{opacity:0;pointer-events:none}.loading-spinner.svelte-b7bqwh{width:32px;height:32px;border:3px solid var(--color-gray-200);border-top-color:var(--color-gray-600);border-radius:50%;animation:svelte-b7bqwh-spin .8s linear infinite}.loading-progress.svelte-b7bqwh{width:200px;height:3px;background:var(--color-gray-200);border-radius:2px;overflow:hidden}.loading-progress-bar.svelte-b7bqwh{width:40%;height:100%;background:var(--color-gray-500);border-radius:2px;animation:svelte-b7bqwh-progress-indeterminate 1.2s ease-in-out infinite}@keyframes svelte-b7bqwh-progress-indeterminate{0%{transform:translate(-100%)}to{transform:translate(350%)}}.loading-text.svelte-b7bqwh{font-size:.875rem;color:var(--color-gray-500)}.navbar.svelte-b7bqwh{display:flex;align-items:center;justify-content:space-between;height:var(--navbar-height);padding:0 var(--space-md);background:var(--color-white);border-bottom:1px solid var(--color-gray-200);flex-shrink:0}.navbar-left.svelte-b7bqwh,.navbar-right.svelte-b7bqwh{display:flex;align-items:center;gap:var(--space-sm)}.navbar-left.svelte-b7bqwh{flex:1;min-width:0}.navbar-right.svelte-b7bqwh{flex:0 0 auto;gap:var(--space-xs)}.logo-link.svelte-b7bqwh{display:flex;align-items:center;height:100%;text-decoration:none}.logo-img.svelte-b7bqwh{height:48px;width:auto;display:block}.mode-toggle.svelte-b7bqwh{display:flex;align-items:center;background:var(--color-gray-100);border-radius:var(--radius-sm);padding:2px;gap:0}.mode-toggle-item.svelte-b7bqwh{font-size:.75rem;font-weight:500;padding:3px 10px;border-radius:calc(var(--radius-sm) - 1px);color:var(--color-gray-500);text-decoration:none;transition:all var(--transition-fast);cursor:pointer;white-space:nowrap}.mode-toggle-item.svelte-b7bqwh:hover:not(.active){color:var(--color-gray-700)}.mode-toggle-item.active.svelte-b7bqwh{background:var(--color-white);color:var(--color-gray-900);box-shadow:0 1px 2px #0000000f;cursor:default}.style-select.svelte-b7bqwh,.font-select.svelte-b7bqwh{appearance:none;-webkit-appearance:none;padding:calc(.5rem - 1px) 2rem calc(.5rem - 1px) .875rem;font-size:.8125rem;font-weight:500;font-family:var(--font-mono);line-height:1;background-color:var(--color-gray-50);background-image:url("data:image/svg+xml,%3Csvg width='12' height='12' viewBox='0 0 24 24' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M6 9L12 15L18 9' stroke='%23737373' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right .75rem center;background-size:1rem;border:1px solid var(--color-gray-200);border-radius:var(--radius-sm);cursor:pointer;box-sizing:border-box}.style-select.svelte-b7bqwh:hover,.font-select.svelte-b7bqwh:hover{background-color:var(--color-gray-100);border-color:var(--color-gray-300)}.workspace.svelte-b7bqwh{flex:1;display:flex;overflow:hidden;background-color:var(--color-gray-100)}.pane.svelte-b7bqwh{flex-shrink:0;height:100%;overflow:hidden;display:flex;flex-direction:column;position:relative;background:#fff}.editor-pane.svelte-b7bqwh{background:var(--editor-bg);position:relative}.preview-pane.svelte-b7bqwh{background:var(--preview-bg)}.preview-toolbar.svelte-b7bqwh{display:flex;align-items:center;justify-content:space-between;padding:4px 8px;border-bottom:1px solid var(--color-gray-200, #e5e7eb);background:var(--color-white, #fff);flex-shrink:0;gap:8px;min-height:36px}.preview-toolbar-left.svelte-b7bqwh{display:flex;align-items:center;gap:6px}.preview-toolbar-right.svelte-b7bqwh{display:flex;align-items:center;gap:8px}.preview-toolbar-right.svelte-b7bqwh>.btn:where(.svelte-b7bqwh){padding:calc(.5rem - 1px) .875rem;font-size:.8125rem}.compiling-badge.svelte-b7bqwh{display:flex;align-items:center;gap:6px;font-size:.75rem;color:var(--color-gray-500, #6b7280)}.error-badge.svelte-b7bqwh{font-size:.75rem;color:#ef4444}.spinner-xs.svelte-b7bqwh{width:12px;height:12px;border:1.5px solid var(--color-gray-200, #e5e7eb);border-top-color:var(--color-gray-500, #6b7280);border-radius:50%;animation:svelte-b7bqwh-spin .6s linear infinite}@keyframes svelte-b7bqwh-spin{to{transform:rotate(360deg)}}.resizer.svelte-b7bqwh{width:var(--divider-width);background:var(--color-gray-200);cursor:col-resize;flex-shrink:0;position:relative;transition:background var(--transition-fast)}.resizer.svelte-b7bqwh:hover,.resizer.active.svelte-b7bqwh{background:var(--color-gray-400)}.menu-container.svelte-b7bqwh{position:relative;display:inline-block}.btn-icon.svelte-b7bqwh{display:flex;align-items:center;justify-content:center;width:32px;height:32px;padding:0}.dropdown-menu.svelte-b7bqwh{position:absolute;top:calc(100% + 4px);right:0;width:200px;background:var(--color-white);border:1px solid var(--color-gray-200);border-radius:var(--radius-sm);box-shadow:var(--shadow-md);z-index:1000;padding:var(--space-xs) 0;display:flex;flex-direction:column}.menu-item.svelte-b7bqwh{display:flex;align-items:center;width:100%;padding:var(--space-xs) var(--space-sm);font-size:.8125rem;color:var(--color-gray-700);background:transparent;border:none;text-align:left;cursor:pointer;text-decoration:none;transition:background-color var(--transition-fast)}.menu-item.svelte-b7bqwh:hover{background-color:var(--color-gray-50);color:var(--color-gray-900)}.menu-item.svelte-b7bqwh:disabled{opacity:.5;cursor:not-allowed}.menu-item.small.svelte-b7bqwh{font-size:.75rem;padding:4px var(--space-sm)}.menu-icon.svelte-b7bqwh{margin-right:var(--space-sm);font-size:1rem;line-height:1}.menu-divider.svelte-b7bqwh{height:1px;background:var(--color-gray-100);margin:var(--space-xs) 0}.mobile-tabs.svelte-b7bqwh{display:none}@media(max-width:768px){.app.svelte-b7bqwh{height:100dvh}.navbar.svelte-b7bqwh{padding:0 var(--space-sm)}.workspace.svelte-b7bqwh{flex-direction:column;position:relative}.pane.svelte-b7bqwh{width:100%!important;height:100%;position:absolute;inset:0;z-index:1;padding-bottom:50px}.pane.mobile-hidden.svelte-b7bqwh{display:none;z-index:0}.resizer.svelte-b7bqwh{display:none}.mobile-tabs.svelte-b7bqwh{display:flex;position:fixed;bottom:0;left:0;right:0;height:50px;background:var(--color-white);border-top:1px solid var(--color-gray-200);z-index:100}.mobile-tab-btn.svelte-b7bqwh{flex:1;border:none;background:transparent;font-size:.875rem;font-weight:500;color:var(--color-gray-500);cursor:pointer;display:flex;align-items:center;justify-content:center;position:relative}.mobile-tab-btn.active.svelte-b7bqwh{color:var(--color-gray-900);background:var(--color-gray-50)}.mobile-tab-btn.active.svelte-b7bqwh:after{content:"";position:absolute;top:0;left:0;right:0;height:2px;background:var(--color-gray-900)}.hidden-mobile.svelte-b7bqwh{display:none!important}}