@import "https://fonts.googleapis.com/css2?family=Cinzel:wght@400;600;700;800;900&family=Outfit:wght@300;400;500;600;700;800&family=Sora:wght@300;400;500;600;700;800&family=Inter:wght@300;400;500;600;700&display=swap";:root{--theme-primary:#1065b7;--theme-primary-rgb:16, 101, 183;--theme-primary-hover:#0d5296;--theme-primary-light:#3282d7;--theme-accent:#f17a1a;--theme-accent-rgb:241, 122, 26;--theme-accent-hover:#ce620e;--theme-blue:#1065b7;--theme-blue-light:#3282d7;--theme-red:#1065b7;--theme-red-rgb:16, 101, 183;--theme-red-hover:#0d5296;--dark-bg:#080c14;--dark-panel:#0f1826;--dark-border:#1c2e4a;--dark-surface:#162240;--light-bg:#f4f6fa;--light-panel:#fff;--light-border:#d8e3f0;--text-dark:#0d1b35;--text-medium:#3b4d68;--text-light:#7a8fa8;--text-white:#fff;--font-heading:"Sora", "Inter", sans-serif;--font-body:"Inter", sans-serif;--shadow-sm:0 2px 8px #003c8c0f;--shadow-md:0 8px 24px #003c8c1f;--shadow-lg:0 16px 40px #003c8c2e;--shadow-glow:0 0 20px #003c8c4d;--shadow-accent:0 0 20px #f078144d;--a4-ratio:1.4142;--a4-width:794px;--a4-height:1123px;--transition-fast:.15s ease;--transition-normal:.25s cubic-bezier(.4, 0, .2, 1)}*{box-sizing:border-box;scrollbar-width:thin;scrollbar-color:#003c8c4d transparent;margin:0;padding:0}::-webkit-scrollbar{width:6px;height:6px}::-webkit-scrollbar-track{background:0 0}::-webkit-scrollbar-thumb{background-color:#003c8c40;border-radius:4px}::-webkit-scrollbar-thumb:hover{background-color:#003c8c80}body{font-family:var(--font-body);background-color:var(--dark-bg);color:var(--text-white);-webkit-font-smoothing:antialiased;min-height:100vh;overflow-x:hidden}.app-container{background-color:var(--dark-bg);flex-direction:column;width:100vw;height:100vh;display:flex}.top-navbar{background-color:var(--dark-panel);border-bottom:1px solid var(--dark-border);z-index:100;justify-content:space-between;align-items:center;height:64px;padding:0 24px;display:flex}.brand-section{align-items:center;gap:12px;display:flex}.brand-logo-accent{background-color:var(--theme-red);width:12px;height:24px;box-shadow:var(--shadow-glow);border-radius:2px;transform:skew(-15deg)}.brand-name{font-family:var(--font-heading);letter-spacing:.5px;color:var(--text-white);font-size:1.25rem;font-weight:700}.brand-subname{color:var(--theme-red)}.nav-controls{align-items:center;gap:16px;display:flex}.tab-group{background-color:var(--dark-bg);border:1px solid var(--dark-border);border-radius:8px;padding:4px;display:flex}.tab-btn{font-family:var(--font-heading);color:var(--text-light);cursor:pointer;transition:var(--transition-fast);background:0 0;border:none;border-radius:6px;align-items:center;gap:8px;padding:8px 16px;font-size:.875rem;font-weight:600;display:flex}.tab-btn:hover{color:var(--text-white)}.tab-btn.active{background-color:var(--theme-red);color:var(--text-white);box-shadow:var(--shadow-glow)}.btn{font-family:var(--font-heading);cursor:pointer;transition:var(--transition-normal);border:none;border-radius:8px;justify-content:center;align-items:center;gap:8px;padding:10px 20px;font-size:.875rem;font-weight:600;display:inline-flex}.btn-primary{background-color:var(--theme-red);color:var(--text-white)}.btn-primary:hover{background-color:var(--theme-red-hover);box-shadow:var(--shadow-glow);transform:translateY(-1px)}.btn-secondary{background-color:var(--dark-border);color:var(--text-white);border:1px solid #ffffff0d}.btn-secondary:hover{background-color:#ffffff14;transform:translateY(-1px)}.btn-icon{width:36px;height:36px;color:var(--text-light);border:1px solid var(--dark-border);cursor:pointer;transition:var(--transition-fast);background-color:#0000;border-radius:8px;justify-content:center;align-items:center;padding:0;display:flex}.btn-icon:hover{color:var(--text-white);background-color:#ffffff0d}.btn-danger{color:var(--theme-red);background-color:#d21f3c26;border:1px solid #d21f3c4d}.btn-danger:hover{background-color:var(--theme-red);color:var(--text-white);box-shadow:var(--shadow-glow)}.workspace-wrapper{flex:1;height:calc(100vh - 64px);display:flex;overflow:hidden}.sidebar-left{background-color:var(--dark-panel);border-right:1px solid var(--dark-border);flex-direction:column;width:280px;display:flex;overflow:hidden}.sidebar-right{background-color:var(--dark-panel);border-left:1px solid var(--dark-border);flex-direction:column;width:320px;display:flex;overflow-y:auto}.main-editor-area{background-color:var(--dark-bg);flex-direction:column;flex:1;display:flex;position:relative;overflow:hidden}.editor-toolbar{border-bottom:1px solid var(--dark-border);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);z-index:10;background-color:#1a1a2280;justify-content:space-between;align-items:center;height:48px;padding:0 20px;display:flex}.toolbar-group{align-items:center;gap:12px;display:flex}.zoom-badge{font-family:var(--font-heading);color:var(--text-light);text-align:center;min-width:44px;font-size:.8rem;font-weight:700}.canvas-scroll-container{flex:1;justify-content:center;align-items:flex-start;padding:40px;display:flex;overflow:auto}.a4-page-frame{width:var(--a4-width);height:var(--a4-height);min-width:var(--a4-width);background-color:var(--light-panel);color:var(--text-dark);transform-origin:top;flex-shrink:0;transition:transform .1s;position:relative;overflow:hidden;box-shadow:0 20px 50px #0006}.a4-page-content{box-sizing:border-box;width:100%;height:100%;padding:0;position:relative}.page-header-template{border-bottom:1px solid var(--theme-red);z-index:5;pointer-events:none;justify-content:space-between;align-items:flex-end;height:44px;padding-bottom:6px;display:flex;position:absolute;top:32px;left:48px;right:48px}.page-header-category{font-family:var(--font-heading);letter-spacing:1.5px;color:var(--theme-red);text-transform:uppercase;font-size:10px;font-weight:800}.page-header-logo{font-family:var(--font-heading);color:var(--text-dark);letter-spacing:.3px;text-align:right;white-space:nowrap;text-overflow:ellipsis;max-width:55%;font-size:9px;font-weight:700;overflow:hidden}.page-footer-template{height:24px;font-family:var(--font-heading);color:#718096;z-index:5;pointer-events:none;border-top:1px solid #e2e8f0;justify-content:space-between;align-items:center;padding-top:8px;font-size:9px;font-weight:500;display:flex;position:absolute;bottom:32px;left:48px;right:48px}.canvas-element-wrapper{cursor:move;transition:border-color var(--transition-fast);border:1px solid #0000;position:absolute}.canvas-element-wrapper:hover{border:1px dashed #d21f3c66}.canvas-element-wrapper.selected{border:1px solid var(--theme-red);box-shadow:0 0 0 1px #d21f3c4d, var(--shadow-glow)}.resize-handle{background-color:var(--theme-red);border:1.5px solid var(--text-white);z-index:100;border-radius:50%;width:8px;height:8px;position:absolute}.resize-handle-se{cursor:se-resize;bottom:-4px;right:-4px}.resize-handle-s{cursor:s-resize;bottom:-4px;left:50%;transform:translate(-50%)}.resize-handle-e{cursor:e-resize;top:50%;right:-4px;transform:translateY(-50%)}.element-text-content{white-space:pre-wrap;word-break:break-word;-webkit-user-select:text;user-select:text;outline:none;width:100%;height:100%}.element-image-content{object-fit:contain;pointer-events:none;width:100%;height:100%}.element-line-content{width:100%;height:100%}.element-table-content{border-collapse:collapse;width:100%;font-family:var(--font-heading);box-shadow:var(--shadow-sm);background-color:#fff;font-size:10px}.element-table-content th{background-color:var(--theme-red);color:#fff;text-align:center;border:1px solid var(--theme-red);letter-spacing:.5px;padding:8px 4px;font-size:10px;font-weight:700}.element-table-content td{text-align:center;color:#2d3748;border:1px solid #e2e8f0;padding:8px 6px}.element-table-content tr:nth-child(2n){background-color:#f7fafc}.sidebar-section{border-bottom:1px solid var(--dark-border);padding:20px}.sidebar-title{font-family:var(--font-heading);color:var(--text-white);letter-spacing:.5px;align-items:center;gap:8px;margin-bottom:12px;font-size:.875rem;font-weight:700;display:flex}.element-library-grid{grid-template-columns:repeat(2,1fr);gap:12px;display:grid}.library-item-card{border:1px solid var(--dark-border);cursor:pointer;transition:var(--transition-normal);background-color:#ffffff05;border-radius:8px;flex-direction:column;align-items:center;gap:8px;padding:14px;display:flex}.library-item-card:hover{background-color:#d21f3c0d;border-color:#d21f3c4d;transform:translateY(-2px)}.library-item-icon{color:var(--theme-red)}.library-item-label{color:var(--text-light);font-size:.75rem;font-weight:600}.form-group{flex-direction:column;gap:6px;margin-bottom:16px;display:flex}.form-label{font-family:var(--font-heading);color:var(--text-light);letter-spacing:.5px;font-size:.75rem;font-weight:700}.form-input{border:1px solid var(--dark-border);color:var(--text-white);font-size:.85rem;font-family:var(--font-body);transition:var(--transition-fast);background-color:#ffffff08;border-radius:6px;padding:8px 12px}.form-input:focus{border-color:var(--theme-red);box-shadow:var(--shadow-glow);outline:none}.form-row{grid-template-columns:repeat(2,1fr);gap:10px;display:grid}.page-thumbnail-list{flex-direction:column;gap:12px;display:flex}.page-thumbnail-item{border:1px solid var(--dark-border);cursor:pointer;transition:var(--transition-fast);background-color:#ffffff05;border-radius:8px;align-items:center;gap:12px;padding:10px;display:flex;position:relative}.page-thumbnail-item:hover{background-color:#ffffff0a}.page-thumbnail-item.active{border-color:var(--theme-red);background-color:#d21f3c0d}.page-thumbnail-preview{color:#a0aec0;width:44px;height:62px;box-shadow:var(--shadow-sm);background-color:#fff;border:1px solid #e2e8f0;border-radius:4px;justify-content:center;align-items:center;font-size:.6rem;font-weight:700;display:flex}.page-thumbnail-info{flex:1;min-width:0}.page-thumbnail-title{color:var(--text-white);white-space:nowrap;text-overflow:ellipsis;font-size:.8rem;font-weight:600;overflow:hidden}.page-thumbnail-number{color:var(--text-light);font-size:.7rem}.viewer-layout-container{background-color:#0b0b0d;flex-direction:column;flex:1;display:flex;position:relative;overflow:hidden}.viewer-book-workspace{flex:1;justify-content:center;align-items:flex-start;padding:20px 40px 40px;display:flex;position:relative;overflow:auto}.book-3d-stage{perspective:2000px;justify-content:center;align-items:center;display:flex;position:relative}.book-spread{background-color:#0000004d;border-radius:12px;justify-content:center;align-items:center;gap:2px;padding:16px;display:flex;position:relative;box-shadow:0 30px 70px #0009}.book-spread:after{content:"";z-index:10;background:linear-gradient(#0000,#ffffff14,#0000);width:1px;position:absolute;top:16px;bottom:16px;left:50%}.viewer-page-wrapper{width:var(--a4-width);height:var(--a4-height);transform-origin:100%;background-color:#fff;flex-shrink:0;transition:transform .6s cubic-bezier(.645,.045,.355,1);position:relative;overflow:hidden;box-shadow:0 4px 20px #00000026}.viewer-page-wrapper.left-page{border-radius:8px 0 0 8px;box-shadow:-15px 15px 30px #0000004d}.viewer-page-wrapper.right-page{border-radius:0 8px 8px 0;box-shadow:15px 15px 30px #0000004d}.page-shadow-overlay{pointer-events:none;z-index:8;width:40px;position:absolute;top:0;bottom:0}.left-page .page-shadow-overlay{background:linear-gradient(90deg,#0000,#0000000f);right:0}.right-page .page-shadow-overlay{background:linear-gradient(270deg,#0000,#0000000f);left:0}.product-hotspot-indicator{border:2px solid var(--theme-red);cursor:pointer;z-index:20;width:24px;height:24px;box-shadow:var(--shadow-glow);background-color:#d21f3c4d;border-radius:50%;justify-content:center;align-items:center;display:flex;position:absolute}.product-hotspot-pulse{background-color:var(--theme-red);opacity:.4;border-radius:50%;width:100%;height:100%;animation:2s ease-out infinite pulse;position:absolute}.product-hotspot-indicator svg{color:#fff;z-index:2;width:12px;height:12px}@keyframes pulse{0%{opacity:.4;transform:scale(1)}to{opacity:0;transform:scale(2.2)}}.hotspot-modal-backdrop{-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);z-index:200;background-color:#000000bf;justify-content:center;align-items:center;animation:.25s ease-out fadeIn;display:flex;position:fixed;inset:0}.hotspot-modal{background-color:var(--dark-panel);border:1px solid var(--dark-border);width:680px;max-width:90%;box-shadow:var(--shadow-lg), var(--shadow-glow);border-radius:16px;flex-direction:column;display:flex;overflow:hidden}.hotspot-modal-header{border-bottom:1px solid var(--dark-border);justify-content:space-between;align-items:center;padding:20px 24px;display:flex}.hotspot-modal-title{font-family:var(--font-heading);color:var(--theme-red);font-size:1.25rem;font-weight:700}.hotspot-modal-content{gap:24px;max-height:70vh;padding:24px;display:flex;overflow-y:auto}.hotspot-modal-image-col{flex-shrink:0;width:240px}.hotspot-modal-image{object-fit:cover;width:100%;height:180px;box-shadow:var(--shadow-md);border:1px solid var(--dark-border);border-radius:8px}.hotspot-modal-info-col{flex-direction:column;flex:1;gap:16px;display:flex}.hotspot-modal-desc{color:#ffffffd9;white-space:pre-wrap;font-size:.9rem;line-height:1.6}.hotspot-modal-footer{border-top:1px solid var(--dark-border);background-color:#00000026;justify-content:flex-end;gap:12px;padding:16px 24px;display:flex}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}.alignment-snap-line{background-color:var(--theme-red);opacity:.6;z-index:99;pointer-events:none;position:absolute}.alignment-snap-line-v{border-left:1px dashed var(--theme-red);width:1px;top:0;bottom:0}.alignment-snap-line-h{border-top:1px dashed var(--theme-red);height:1px;left:0;right:0}.empty-state-container{height:100%;color:var(--text-light);text-align:center;flex-direction:column;justify-content:center;align-items:center;gap:16px;padding:40px;display:flex}.empty-state-icon{color:var(--dark-border)}@media (width<=768px){.editor-toolbar{flex-wrap:wrap!important;gap:6px!important;height:auto!important;min-height:48px!important;padding:6px 10px!important}.toolbar-group{gap:6px!important}.mobile-hide{display:none!important}.mobile-search-input{width:80px!important}}.compare-modal-content{color:#e2e8f0;background-color:#13131a;border:1px solid #22222f;border-radius:16px;flex-direction:column;width:100%;max-width:1080px;height:calc(100vh - 24px);max-height:calc(100vh - 24px);display:flex;overflow:hidden;box-shadow:0 25px 50px -12px #000000bf}.compare-table-wrapper{-webkit-overflow-scrolling:touch;flex:1;padding:24px 24px 60px;overflow:auto}.compare-table{table-layout:fixed;border-collapse:collapse;text-align:left;width:100%;min-width:600px}.compare-desktop-view{flex-direction:column;flex:1;min-height:0;display:flex;overflow:hidden}.compare-mobile-view{display:none}@media (width<=768px){.compare-desktop-view{display:none!important}.compare-mobile-view{flex-direction:column;flex:1;overflow:hidden;display:flex!important}.compare-modal-content{border-radius:12px;margin:8px;height:calc(100vh - 16px)!important;max-height:calc(100vh - 16px)!important}.compare-modal-header{padding:10px 12px!important}.compare-cat-bar{flex-wrap:wrap!important;flex-shrink:0!important;min-height:40px!important;padding:6px 10px!important}.product-floating-actions{gap:6px!important;bottom:35px!important;right:12px!important}.product-floating-btn{padding:8px 10px!important;font-size:11px!important}}