*{margin:0;padding:0;box-sizing:border-box;}.loading-overlay{position:fixed;top:0;left:0;width:100%;height:100%;background:rgba(128,128,128,0.95);display:flex;justify-content:center;align-items:center;z-index:99999;transition:opacity 0.3s ease-out;}.loading-overlay.hidden{opacity:0;pointer-events:none;}.loading-content{text-align:center;color:white;}.loading-spinner{width:60px;height:60px;border:5px solid rgba(255,255,255,0.3);border-top:5px solid white;border-radius:50%;animation:loadingSpin 1s linear infinite;margin:0 auto 20px;}@keyframes loadingSpin{0%{transform:rotate(0deg);}100%{transform:rotate(360deg);}}.loading-text{font-size:1.4em;font-weight:600;text-shadow:0 2px 4px rgba(0,0,0,0.3);}body{font-family:-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,Oxygen,Ubuntu,Cantarell,sans-serif;background:linear-gradient(135deg,#FFFFFF 0%,#eee 100%);min-height:100vh;padding:clamp(5px,1vw,20px);color:#333;overflow-x:hidden;display:flex;flex-direction:column;}.container{max-width:100%;margin:0 auto;height:auto;min-height:auto;display:flex;flex-direction:column;width:100%;flex:0 0 auto;}.settings-btn{position:fixed;top:10px;right:10px;background:transparent !important;color:#AAD37C !important;padding:10px;border:none;border-radius:6px;cursor:pointer;font-weight:600;font-size:1.5em;transition:transform 0.2s,filter 0.2s;display:inline-flex;align-items:center;justify-content:center;width:48px;height:48px;z-index:10000;filter:brightness(0) saturate(100%) invert(77%) sepia(25%) saturate(1000%) hue-rotate(60deg) brightness(95%) contrast(85%);}.settings-btn:hover{background:transparent !important;transform:translateY(-2px);filter:brightness(0) saturate(100%) invert(70%) sepia(30%) saturate(1000%) hue-rotate(60deg) brightness(90%) contrast(85%);}.settings-overlay{position:fixed;top:0;left:0;right:0;bottom:0;background:rgba(0,0,0,0.5);z-index:1999;opacity:0;visibility:hidden;transition:opacity 0.3s ease-in-out,visibility 0.3s ease-in-out;}.settings-overlay.active{opacity:1;visibility:visible;}.settings-popup{position:fixed;top:0;left:0;right:0;background:white;box-shadow:0 4px 12px rgba(0,0,0,0.15);z-index:2000;transition:transform 0.3s ease-in-out;border-bottom:2px solid #e0e0e0;transform:translateY(-100%);}.settings-popup.active{transform:translateY(0);}.settings-content{max-width:1200px;margin:0 auto;padding:20px;}.settings-content h3{margin-bottom:20px;color:#333;font-size:1.3em;}.settings-section{background:#f9f9f9;border:1px solid #e0e0e0;border-radius:8px;padding:15px;margin-bottom:20px;}.settings-item{display:flex;align-items:center;gap:15px;margin-bottom:15px;}.settings-section .settings-item:last-child{margin-bottom:0;}.settings-item label{font-weight:600;color:#333;min-width:100px;}.settings-item select,.settings-item input[type="text"],.settings-item input[type="email"]{padding:6px 12px;border:1px solid #ddd;border-radius:6px;background:white;font-size:0.9em;color:#333;flex:1;}.settings-item select{cursor:pointer;}#languageSelect{max-width:150px;}.settings-item input[type="text"],.settings-item input[type="email"]{min-width:200px;}header{text-align:center;color:rgba(152,211,97,0.9);margin-bottom:10px;flex-shrink:0;}header h1{font-size:clamp(1.2em,4vw,2.5em);margin-bottom:5px;}header p{font-size:1.1em;opacity:0.9;}.toolbar{background:white;border-radius:12px;padding:10px 15px;margin-bottom:10px;box-shadow:0 4px 6px rgba(0,0,0,0.1);display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:10px;flex-shrink:0;}.toolbar2{margin-bottom:10px;display:flex;justify-content:center;align-items:center;gap:15px;flex-shrink:0;}.book-actions{display:flex;gap:10px;align-items:center;justify-content:space-between;min-width:200px;}.gallery-actions{display:flex;gap:10px;align-items:center;justify-content:space-between;margin-top:10px;padding-top:10px;border-top:1px solid #e0e0e0;position:relative;z-index:10;}.spacer{flex:1;}.upload-section{display:flex;gap:10px;align-items:center;}.upload-btn{background:linear-gradient(135deg,rgba(152,211,97,0.9) 0%,rgba(152,211,97,0.9) 100%);color:white;padding:8px 16px;border-radius:8px;cursor:pointer;font-weight:600;transition:transform 0.2s,box-shadow 0.2s;display:inline-block;font-size:0.9em;}.upload-btn:hover{transform:translateY(-2px);box-shadow:0 4px 12px rgba(102,126,234,0.4);}.btn-secondary{background:#f0f0f0;color:#333;padding:8px 16px;border:none;border-radius:8px;cursor:pointer;font-weight:600;transition:background 0.2s;font-size:0.9em;position:relative;}.btn-secondary:hover{background:#e0e0e0;}.icon-btn{background:#f0f0f0;color:#333;padding:8px 12px;border:none;border-radius:8px;cursor:pointer;font-weight:600;font-size:1.2em;transition:background 0.2s,transform 0.2s;position:relative;display:inline-flex;align-items:center;justify-content:center;min-width:36px;height:36px;}.icon-btn:hover{background:#e0e0e0;transform:translateY(-2px);}.icon-btn:active{transform:translateY(0);}.icon-btn:disabled{opacity:0.5;cursor:not-allowed;background:#e0e0e0;}.icon-btn:disabled:hover{transform:none;background:#e0e0e0;}#clearBtn,#clearGalleryBtn{background:transparent;}#clearBtn:hover,#clearGalleryBtn:hover{background:transparent;}#saveProjectBtn::after,#saveProjectBtn::before{display:none !important;}#sendToPrintBtn{background:#AAD37C !important;color:#333 !important;border:none !important;}#sendToPrintBtn:hover{background:#9BC66A !important;color:#333 !important;}#sendToPrintBtn::after,#sendToPrintBtn::before{display:none !important;}.icon-btn::after,.btn-secondary::after{content:attr(data-tooltip);position:absolute;bottom:100%;left:50%;transform:translateX(-50%);margin-bottom:5px;padding:6px 10px;background:rgba(0,0,0,0.6);color:white;border-radius:12px;font-size:0.85em;white-space:nowrap;pointer-events:none;z-index:10000;font-weight:normal;opacity:0;transition:opacity 0.2s;visibility:hidden;}.gallery-actions .icon-btn:first-child::after{left:0;transform:translateX(0);}.gallery-actions .icon-btn:first-child::before{left:15px;transform:translateX(0);}.icon-btn:hover::after,.btn-secondary:hover::after{opacity:1;visibility:visible;}.icon-btn::before,.btn-secondary::before{content:'';position:absolute;bottom:100%;left:50%;transform:translateX(-50%);margin-bottom:-1px;border:5px solid transparent;border-top-color:rgba(0,0,0,0.6);pointer-events:none;z-index:10000;opacity:0;transition:opacity 0.2s;visibility:hidden;}.icon-btn:hover::before,.btn-secondary:hover::before{opacity:1;visibility:visible;}.icon-btn-primary{background:linear-gradient(135deg,rgba(152,211,97,0.9) 0%,rgba(152,211,97,0.9) 100%);color:white;}.icon-btn-primary:hover{background:linear-gradient(135deg,rgba(152,211,97,1) 0%,rgba(152,211,97,1) 100%);transform:translateY(-2px);box-shadow:0 4px 12px rgba(102,126,234,0.4);}.icon-btn-gray{background:#999;color:white;}.icon-btn-gray:hover{background:#777;transform:translateY(-2px);box-shadow:0 4px 12px rgba(0,0,0,0.2);}.icon-btn-gray:disabled{opacity:0.5;cursor:not-allowed;background:#999;}.controls{display:flex;align-items:center;gap:15px;}.layout-select{padding:10px 15px;border:2px solid #667eea;border-radius:8px;background:white;color:#333;font-weight:600;cursor:pointer;font-size:14px;transition:all 0.2s;}.layout-select:hover{border-color:#5568d3;background:#f8f9ff;}.layout-select:focus{outline:none;border-color:#5568d3;box-shadow:0 0 0 3px rgba(102,126,234,0.1);}.btn-nav{background:#667eea;color:white;padding:10px 20px;border:none;border-radius:8px;cursor:pointer;font-weight:600;transition:background 0.2s;}.btn-nav:hover:not(:disabled){background:#5568d3;}.btn-nav:disabled{background:#ccc;cursor:not-allowed;}#pageInfo{font-weight:600;min-width:100px;text-align:center;}.main-content{display:flex;gap:15px;align-items:flex-start;flex:0 0 auto;min-height:0;overflow:visible;}.gallery{background:white;border-radius:12px;padding:clamp(10px,2vw,20px);box-shadow:0 4px 6px rgba(0,0,0,0.1);flex:0 0 auto;width:100%;max-width:100%;display:flex;flex-direction:column;overflow:visible;align-self:stretch;}.book-section{flex:1;display:flex;flex-direction:column;align-items:center;min-width:0;overflow:visible;}.book-container{perspective:2000px;display:flex;justify-content:center;align-items:center;height:auto;margin-bottom:10px;width:100%;overflow:hidden;position:relative;}.book{position:relative;width:100%;max-width:900px;aspect-ratio:2 / 1;transform-style:preserve-3d;transition:transform 0.6s;}.page{position:absolute;width:50%;height:100%;aspect-ratio:1 / 1;background:#f9f9f9;border:1px solid #ddd;box-shadow:0 0 20px rgba(0,0,0,0.3);transform-style:preserve-3d;transition:transform 1s cubic-bezier(0.645,0.045,0.355,1);}.left-page{left:0;transform-origin:right center;border-radius:8px 0 0 8px;}.right-page{right:0;transform-origin:left center;border-radius:0 8px 8px 0;}.page-content,.page-back{position:absolute;width:100%;height:100%;top:0;left:0;padding:20px;overflow:hidden;backface-visibility:hidden;-webkit-backface-visibility:hidden;}.page-content{background:#f9f9f9;}.page-back{background:#f9f9f9;transform:rotateY(180deg);}.page-dimension{position:absolute;top:5px;left:5px;background:rgba(0,0,0,0.7);color:white;padding:4px 8px;border-radius:4px;font-size:11px;font-family:monospace;z-index:1000;pointer-events:none;user-select:none;}.image-dimension{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);background:rgba(0,0,0,0.7);color:white;padding:4px 8px;border-radius:4px;font-size:11px;font-family:monospace;z-index:1001;pointer-events:none;user-select:none;display:block !important;visibility:visible !important;opacity:1 !important;}body.hide-sizes .page-dimension,body.hide-sizes .image-dimension{display:none !important;visibility:hidden !important;opacity:0 !important;}#book:has(.page.turning-next) .page-dimension,#book:has(.page.turning-prev) .page-dimension,#book:has(.page.turning-next) .image-dimension,#book:has(.page.turning-prev) .image-dimension{display:none !important;visibility:hidden !important;opacity:0 !important;}.page.turning-next .page-dimension,.page.turning-prev .page-dimension,.page.turning-next .image-dimension,.page.turning-prev .image-dimension{display:none !important;visibility:hidden !important;opacity:0 !important;}.page.turning-next{transform:rotateY(-180deg);}.page.turning-prev{transform:rotateY(180deg);}.image-container{width:100%;height:100%;display:flex;align-items:center;justify-content:center;background:transparent;border-radius:4px;position:relative;overflow:visible;}.book-image-wrapper{position:relative;width:100%;height:100%;display:flex;align-items:center;justify-content:center;overflow:visible;}.book-image-wrapper.active{border:2px solid #667eea;box-shadow:0 0 0 3px rgba(102,126,234,0.2);}.book-image-inner-wrapper-4-per-page{position:absolute;top:0;left:0;width:100%;height:100%;display:flex;align-items:center;justify-content:center;overflow:hidden;border-radius:0;}.image-container[data-layout-type="4"] .book-image-inner-wrapper-4-per-page{align-items:stretch;}.image-container[data-layout-type="4"] .book-image-inner-wrapper-4-per-page img{object-fit:cover;object-position:center;}.image-container[data-layout-type="4"] .split-half .book-image-inner-wrapper-4-per-page img{object-fit:cover;object-position:center;}.image-container img{max-width:100%;max-height:100%;object-fit:contain;border-radius:0;box-shadow:0 2px 8px rgba(0,0,0,0.1);}#book .image-container img,#book .split-half img,#book .split-quarter img{border-radius:0;}.image-container[data-layout-type="2"].single-half{display:flex;justify-content:center;align-items:center;padding:0;overflow:hidden;}.image-container[data-layout-type="2"].single-half .split-half{position:relative;display:flex;align-items:stretch;justify-content:center;border:none;border-radius:0;flex-shrink:0;flex-grow:0;box-sizing:border-box;}.page:has(.image-container[data-layout-type="2"].single-half) .page-content{padding:0 !important;}.image-container[data-layout-type="2"] .book-image-wrapper{height:100%;}.image-container[data-layout-type="2"] .book-image-inner-wrapper{}.image-container[data-layout-type="2"] img,.image-container[data-layout-type="2"] .split-half img{height:100%;width:auto;max-width:100%;object-fit:cover;}.image-container[data-layout-type="2"] .split-half .book-image-wrapper{height:100%;position:relative;}.image-container[data-layout-type="2"] .book-image-wrapper .image-dimension{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);z-index:1001;display:block !important;visibility:visible !important;}.image-container[data-layout-type="2"] .split-half .book-image-inner-wrapper{}.image-container.empty{border:2px dashed #ccc;background:transparent;}.page-content{background:#f9f9f9;}.page-content:has(.image-container.split-container){padding:0;}.page-content:has(.image-container[data-layout-type="4"]){overflow:visible;}.page-content:has(.image-container[data-layout-type="2"].single-half),.page-content:has(.image-container[data-layout-type="2"]){padding:0 !important;overflow:visible !important;}.page .page-content:has(.image-container[data-layout-type="2"]){padding:0 !important;}.image-container.split-container{display:flex;flex-direction:row;gap:10px;padding:0;position:absolute;top:0;left:0;width:100%;height:100%;margin:0;box-sizing:border-box;}.image-container[data-layout-type="4"].split-container{left:0;width:100%;justify-content:center;gap:1%;overflow:visible;}.image-container.split-container .book-image-wrapper{height:100%;}.image-container.split-container .book-image-inner-wrapper{}.image-container.split-container img{height:100%;width:auto;max-width:100%;object-fit:cover;}.image-container.split-container .split-half{width:calc(50% - 5px);height:100%;position:relative;display:flex;align-items:stretch;justify-content:center;border:none;border-radius:0;}.image-container[data-layout-type="4"].split-container .split-half{width:43%;align-items:flex-start;overflow:visible;}.image-container.split-container .split-half .book-image-wrapper{height:100%;}.image-container[data-layout-type="4"].split-container .split-half .book-image-wrapper{height:auto;min-height:100%;}.image-container.split-container .split-half .book-image-inner-wrapper{}.image-container.split-container .split-half img{height:100%;width:auto;max-width:100%;object-fit:cover;}.image-container[data-layout-type="4"].split-container .split-half img{width:100% !important;height:auto !important;min-height:100%;object-fit:cover;object-position:center;}.image-container.split-container .split-half:first-child{border-right:none;}.image-container.split-container .split-half.empty{border:2px dashed #ccc;background:transparent;}.image-container.split-container .split-half.empty::before{content:'';position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);background-image:url('/assets/images/bird-logo.png');background-size:contain;background-repeat:no-repeat;background-position:center;width:40px;height:40px;opacity:0.3;z-index:1;}.image-container.split-container:has(.quad-container){display:flex;flex-direction:column;align-items:flex-end;justify-content:flex-start;}.image-container.split-container.quad-container{display:grid;grid-template-columns:74.07% 1.23% 24.69%;grid-template-rows:32.5% 1.25% 32.5% 1.25% 32.5%;gap:0;padding:0;position:relative;width:81%;height:80%;margin-top:10%;margin-left:10%;margin-right:auto;}.image-container.split-container.quad-container .split-quarter{position:relative;display:flex;align-items:center;justify-content:center;border:none;border-radius:0;}.image-container.split-container.quad-container .split-quarter:nth-child(1){grid-column:1;grid-row:1 / -1;width:100%;height:100%;justify-content:flex-end;align-items:stretch;overflow:visible;}.image-container.split-container.quad-container .split-quarter:nth-child(1) .book-image-wrapper{justify-content:flex-end;align-items:stretch;height:auto;min-height:100%;}.image-container.split-container.quad-container .split-quarter:nth-child(1) .book-image-inner-wrapper{justify-content:flex-end;align-items:stretch;}.image-container.split-container.quad-container .split-quarter:nth-child(1) img{width:100% !important;height:auto !important;min-height:100%;object-fit:cover;object-position:center center;}.image-container.split-container.quad-container .split-quarter:nth-child(2),.image-container.split-container.quad-container .split-quarter:nth-child(3),.image-container.split-container.quad-container .split-quarter:nth-child(4){width:90%;height:100%;justify-self:start;align-self:start;}.image-container.split-container.quad-container .split-quarter:nth-child(2){grid-column:3;grid-row:1;}.image-container.split-container.quad-container .split-quarter:nth-child(3){grid-column:3;grid-row:3;}.image-container.split-container.quad-container .split-quarter:nth-child(4){grid-column:3;grid-row:5;}.image-container.split-container.quad-container .split-quarter:nth-child(2) img,.image-container.split-container.quad-container .split-quarter:nth-child(3) img,.image-container.split-container.quad-container .split-quarter:nth-child(4) img{width:100% !important;height:auto !important;min-height:100%;object-fit:cover;object-position:center;}.image-container.split-container.quad-container .split-quarter.empty{border:2px dashed #ccc;background:transparent;}.image-container.split-container.quad-container .split-quarter.empty::before{content:'';position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);background-image:url('/assets/images/bird-logo.png');background-size:contain;background-repeat:no-repeat;background-position:center;width:30px;height:30px;opacity:0.3;z-index:1;}.image-container.empty{position:relative;}.image-container.empty::before{content:'';position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);background-image:url('/assets/images/bird-logo.png');background-size:contain;background-repeat:no-repeat;background-position:center;width:100px;height:100px;opacity:0.3;z-index:1;}.image-container[data-layout-type="0"]::before,.image-container[data-layout-type="0"] .split-half::before,.image-container[data-layout-type="0"] .split-quarter::before{display:none !important;}.image-container.cover-no-photos::before{content:none;}.image-container.cover-no-photos{border:none;}.image-container.cover-no-photos,.image-container.cover-single-photo{border:2px dashed #ccc !important;background:transparent !important;pointer-events:auto !important;}.image-container.cover-no-photos.empty,.image-container.cover-single-photo.empty{border:2px dashed #ccc !important;background:transparent !important;}.page.turning-next,.page.turning-prev{box-shadow:0 10px 40px rgba(0,0,0,0.5);}.gallery-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:10px;}.gallery h3{margin-bottom:0;color:#333;font-size:1.1em;flex-shrink:0;}.icon-btn-upload{margin:0;cursor:pointer;background:linear-gradient(135deg,rgba(152,211,97,0.9) 0%,rgba(152,211,97,0.9) 100%);color:white;}.icon-btn-upload:hover{background:linear-gradient(135deg,rgba(152,211,97,1) 0%,rgba(152,211,97,1) 100%);transform:translateY(-2px);box-shadow:0 4px 12px rgba(102,126,234,0.4);}.icon-btn-upload input[type="file"]{position:absolute;width:0;height:0;opacity:0;overflow:hidden;}.gallery-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;min-height:100px;flex:1;overflow-y:auto;overflow-x:hidden;align-items:start;grid-auto-rows:min-content;grid-auto-flow:row;position:relative;width:100%;}.gallery-placeholder{grid-column:1 / -1;text-align:center;padding:40px;color:#999;}.gallery-placeholder .hint{font-size:0.9em;margin-top:10px;opacity:0.7;}.gallery-item{position:relative;width:100%;border-radius:8px;overflow:visible;cursor:pointer;transition:transform 0.2s,box-shadow 0.2s;border:2px solid transparent;display:block;min-width:0;min-height:0;grid-column:auto;grid-row:auto;margin:0;padding:0;float:none;}.gallery-item:hover{transform:scale(1.02);box-shadow:0 4px 12px rgba(0,0,0,0.2);}.gallery-item.active{border-color:#667eea;box-shadow:0 0 0 3px rgba(102,126,234,0.2);}.usage-checkboxes{position:absolute;bottom:5px;right:5px;display:flex;gap:4px;z-index:10;}.usage-checkbox{width:20px;height:20px;background:#4caf50;border-radius:50%;display:flex;align-items:center;justify-content:center;color:white;font-size:12px;font-weight:bold;box-shadow:0 2px 4px rgba(0,0,0,0.2);}.resolution-warning{position:absolute;bottom:5px;left:5px;background:rgba(255,193,7,0.9);border-radius:50%;width:24px;height:24px;display:flex;align-items:flex-start;justify-content:center;padding-top:2px;font-size:14px;z-index:10;cursor:help;box-shadow:0 2px 4px rgba(0,0,0,0.2);}.resolution-warning::after{content:attr(data-tooltip);position:absolute;bottom:calc(100%+5px);left:50%;transform:translateX(-50%);padding:6px 10px;background:rgba(0,0,0,0.6);color:white;border-radius:12px;font-size:0.85em;white-space:nowrap;pointer-events:none;z-index:10001;font-weight:normal;opacity:0;transition:opacity 0.2s;visibility:hidden;}.gallery-item:nth-child(3n+1) .resolution-warning::after{left:0;transform:translateX(0);}.gallery-item:nth-child(3n) .resolution-warning::after{left:auto;right:0;transform:translateX(0);}.resolution-warning:hover::after{opacity:1;visibility:visible;}.resolution-warning::before{content:'';position:absolute;bottom:calc(100% - 1px);left:50%;transform:translateX(-50%);border:5px solid transparent;border-top-color:rgba(0,0,0,0.6);pointer-events:none;z-index:10001;opacity:0;transition:opacity 0.2s;visibility:hidden;}.gallery-item:nth-child(3n+1) .resolution-warning::before{left:15px;transform:translateX(0);}.gallery-item:nth-child(3n) .resolution-warning::before{left:auto;right:15px;transform:translateX(0);}.resolution-warning:hover::before{opacity:1;visibility:visible;}.gallery-item-image-wrapper{position:relative;width:100%;border-radius:8px;overflow:hidden;}.gallery-item img{width:100%;height:auto;object-fit:contain;display:block;}.gallery-item .remove-btn{position:absolute;top:5px;right:5px;background:rgba(255,0,0,0.8);color:white;border:none;border-radius:50%;width:24px;height:24px;cursor:pointer;font-size:14px;display:flex;align-items:center;justify-content:center;opacity:0;transition:opacity 0.2s;z-index:10;}.book-remove-btn{position:absolute;top:calc(50% - 35px);left:50%;right:auto;transform:translate(-50%,-50%);background:rgba(255,0,0,0.8);color:white;border:none;border-radius:50%;width:24px;height:24px;cursor:pointer;font-size:14px;display:flex;align-items:center;justify-content:center;opacity:0 !important;transition:opacity 0.2s;z-index:1002;pointer-events:auto;}.book-image-wrapper:hover>.book-remove-btn{opacity:1 !important;}.image-container:hover>.book-image-wrapper>.book-remove-btn{opacity:1 !important;}.split-half:hover .book-image-wrapper>.book-remove-btn,.split-quarter:hover .book-image-wrapper>.book-remove-btn{opacity:1 !important;}.book-image-wrapper:not(:hover)>.book-remove-btn:not(:hover),.image-container:not(:hover) .book-image-wrapper:not(:hover)>.book-remove-btn,.split-half:not(:hover) .book-image-wrapper:not(:hover)>.book-remove-btn,.split-quarter:not(:hover) .book-image-wrapper:not(:hover)>.book-remove-btn{opacity:0 !important;}.book-remove-btn::after{content:attr(data-tooltip);position:absolute;bottom:calc(100%+5px);left:50%;transform:translateX(-50%);padding:6px 10px;background:rgba(0,0,0,0.6);color:white;border-radius:12px;font-size:0.85em;white-space:nowrap;pointer-events:none;z-index:10005;font-weight:normal;opacity:0;transition:opacity 0.2s;visibility:hidden;}.book-remove-btn:hover::after{opacity:1;visibility:visible;}.book-remove-btn::before{content:'';position:absolute;bottom:calc(100% - 1px);left:50%;transform:translateX(-50%);border:5px solid transparent;border-top-color:rgba(0,0,0,0.6);pointer-events:none;z-index:10005;opacity:0;transition:opacity 0.2s;visibility:hidden;}.book-remove-btn:hover::before{opacity:1;visibility:visible;}.page-content .book-image-wrapper,.page-back .book-image-wrapper{pointer-events:auto;}.gallery-item:hover .remove-btn{opacity:1;}.resize-handle{position:absolute;width:10px;height:10px;background-color:#007bff;border:2px solid #fff;border-radius:50%;cursor:pointer;z-index:1003;box-shadow:0 2px 4px rgba(0,0,0,0.2);display:flex;align-items:center;justify-content:center;font-size:10px;color:white;font-weight:bold;}.resize-handle.resize-nw{top:-5px;left:-5px;cursor:nw-resize;}.resize-handle.resize-ne{top:-5px;right:-5px;cursor:ne-resize;}.resize-handle.resize-sw{bottom:-5px;left:-5px;cursor:sw-resize;}.resize-handle.resize-se{bottom:-5px;right:-5px;cursor:se-resize;}.resize-handle{opacity:0;transition:opacity 0.2s;}.image-container:hover .resize-handle,.book-image-wrapper:hover .resize-handle{opacity:1;}.image-container[data-frame="true"]:hover .resize-handle,.image-container[data-frame="true"] .book-image-wrapper:hover .resize-handle{opacity:1;}.frame-delete-btn{opacity:0;transition:opacity 0.2s;position:absolute;top:5px;left:50%;transform:translateX(-50%);width:20px;height:20px;background-color:#dc3545;color:white;border:2px solid #fff;border-radius:50%;cursor:pointer;font-size:14px;font-weight:bold;display:flex;align-items:center;justify-content:center;z-index:1004;box-shadow:0 2px 4px rgba(0,0,0,0.2);pointer-events:auto;}.image-container[data-frame="true"]:has(.book-image-wrapper:hover) .frame-delete-btn,.image-container[data-frame="true"]:has(img[data-image-id]:hover) .frame-delete-btn,.image-container[data-frame="true"]:hover .frame-delete-btn,.frame-delete-btn:hover{opacity:1 !important;}.frame-delete-btn::after{content:attr(data-tooltip);position:absolute;bottom:calc(100%+5px);left:50%;transform:translateX(-50%);padding:6px 10px;background:rgba(0,0,0,0.6);color:white;border-radius:12px;font-size:0.85em;white-space:nowrap;pointer-events:none;z-index:10005;font-weight:normal;opacity:0;transition:opacity 0.2s;visibility:hidden;}.frame-delete-btn:hover::after{opacity:1;visibility:visible;}.frame-delete-btn::before{content:'';position:absolute;bottom:calc(100% - 1px);left:50%;transform:translateX(-50%);border:5px solid transparent;border-top-color:rgba(0,0,0,0.6);pointer-events:none;z-index:10005;opacity:0;transition:opacity 0.2s;visibility:hidden;}.frame-delete-btn:hover::before{opacity:1;visibility:visible;}.book-container.drag-over{transform:scale(1.02);}.book-container.drag-over .page{border-color:#667eea;box-shadow:0 0 20px rgba(102,126,234,0.5);}.image-container[data-frame="true"].drag-over-frame{border-color:#667eea !important;border-width:3px !important;border-style:solid !important;background-color:rgba(102,126,234,0.1) !important;box-shadow:0 0 15px rgba(102,126,234,0.5) !important;transform:scale(1.05);transition:all 0.2s ease;}.upload-overlay{position:fixed;top:0;left:0;width:100%;height:100%;background:rgba(0,0,0,0.7);display:flex;justify-content:center;align-items:center;z-index:10000;backdrop-filter:blur(4px);}.upload-overlay-content{background:white;border-radius:16px;padding:40px 60px;text-align:center;box-shadow:0 8px 32px rgba(0,0,0,0.3);min-width:300px;}.spinner{width:50px;height:50px;border:4px solid #f3f3f3;border-top:4px solid #667eea;border-radius:50%;animation:spin 1s linear infinite;margin:0 auto 20px;}@keyframes spin{0%{transform:rotate(0deg);}100%{transform:rotate(360deg);}}.success-icon{width:80px;height:80px;border-radius:50%;background:#4CAF50;color:white;font-size:50px;display:flex;align-items:center;justify-content:center;margin:0 auto 20px;font-weight:bold;}.error-icon{width:80px;height:80px;border-radius:50%;background:#f44336;color:white;font-size:50px;display:flex;align-items:center;justify-content:center;margin:0 auto 20px;font-weight:bold;}.btn-ok{margin-top:20px;padding:12px 40px;background:#667eea;color:white;border:none;border-radius:8px;font-size:16px;font-weight:600;cursor:pointer;transition:background 0.2s,transform 0.1s;}.btn-ok:hover{background:#5568d3;transform:translateY(-2px);}.btn-ok:active{transform:translateY(0);}.btn-abort-print{margin-top:20px;padding:10px 20px;background:#dc3545 !important;color:white !important;border:none !important;border-radius:4px;cursor:pointer !important;font-size:1em;position:relative;z-index:10001;pointer-events:auto !important;}.btn-abort-print:hover{background:#c82333 !important;}.btn-abort-print:active{background:#bd2130 !important;}.upload-progress-text{font-size:1.2em;font-weight:600;color:#333;margin-bottom:10px;}.upload-progress-count{font-size:1em;color:#666;}footer{background:white;border-top:1px solid #e0e0e0;padding:15px 20px;margin-top:auto;display:flex;justify-content:center;align-items:center;box-shadow:0 -2px 8px rgba(0,0,0,0.05);visibility:visible;flex-shrink:0;width:100%;}.copyright{font-size:0.9em;color:#666;margin:0;}