*{box-sizing:border-box;margin:0;padding:0}body{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Fira Sans,Droid Sans,Helvetica Neue,sans-serif;overflow:hidden}#root,body{height:100vh;min-height:600px}#root{width:100vw}.app{display:flex;flex-direction:column;height:100vh;min-height:600px}.top-bar{align-items:center;background-color:#f5f5f5;border-bottom:1px solid #ddd;display:flex;gap:15px;height:60px;padding:0 20px}.url-input{border:1px solid #ddd;border-radius:4px;flex:1 1;padding:0 12px}.load-button,.url-input{font-size:14px;height:40px}.load-button{background-color:#007bff;border:none;border-radius:4px;color:#fff;cursor:pointer;padding:0 20px}.load-button:hover{background-color:#0056b3}.main-content{display:flex;flex:1 1;overflow:hidden}.preview-section{border-right:1px solid #ddd;display:flex;flex:1 1;flex-direction:column;position:relative}.preview-controls{align-items:center;background-color:#f8f9fa;border-bottom:1px solid #ddd;display:flex;flex-wrap:wrap;gap:15px;height:60px;min-height:60px;padding:10px 15px;position:relative;z-index:100}.upload-button{background-color:#28a745;border:1px solid #28a745;border-radius:4px;color:#fff;cursor:pointer;font-size:13px;font-weight:500;min-height:36px;padding:10px 16px;white-space:nowrap}.upload-button:hover{background-color:#1e7e34;border-color:#1e7e34}.ai-review-button{background-color:#007bff;border:1px solid #0056b3;font-size:13px;font-weight:500;min-height:36px;padding:10px 16px;white-space:nowrap}.ai-review-button:hover:not(:disabled){background-color:#0056b3}.ai-review-button:disabled{border-color:#545b62;opacity:.6}.control-group{align-items:center;display:flex;font-size:12px;gap:8px}.control-slider{width:100px}.viewport-selector{background-color:#fff;border:1px solid #ddd;border-radius:4px;font-size:12px;padding:4px 8px}.scale-info{color:#666;font-size:11px;margin-left:8px}.design-size-selector{background-color:#fff;border:1px solid #ddd;border-radius:4px;font-size:12px;min-width:140px;padding:4px 8px}.preview-container{flex:1 1;overflow:auto;padding:20px}.iframe-wrapper,.preview-container{background-color:#fff;position:relative}.iframe-wrapper{border:1px solid #ddd;box-shadow:0 2px 8px #0000001a;display:inline-block;margin:0}.preview-iframe{background-color:#fff;border:none;display:block}.design-overlay{-webkit-backface-visibility:hidden;backface-visibility:hidden;border:2px dashed #007bff4d;contain:layout style paint;cursor:move;pointer-events:all;position:absolute;transform:translateZ(0) translateZ(0);transition:border-color .2s ease;-webkit-user-select:none;user-select:none;will-change:auto;z-index:10}.design-overlay:hover{border-color:#007bff99}.design-overlay.dragging{border-color:#007bffcc;box-shadow:0 4px 12px #007bff4d;cursor:grabbing!important;will-change:transform}.design-overlay.resizing{border-color:#ff8c00cc;box-shadow:0 4px 12px #ff8c004d;will-change:transform}.resize-handle{background-color:initial;cursor:pointer;height:24px;opacity:0;pointer-events:all;position:absolute;width:24px;z-index:15}.design-overlay:hover .resize-handle{opacity:1}.resize-handle:before{background-color:#007bff;border:2px solid #fff;border-radius:50%;box-shadow:0 1px 3px #0000004d;content:"";height:8px;left:50%;position:absolute;top:50%;transform:translate(-50%,-50%);transition:all .2s ease;width:8px}.resize-handle:hover:before{background-color:#0056b3;transform:translate(-50%,-50%) scale(1.2)}.resize-handle.nw{cursor:nw-resize;left:-12px;top:-12px}.resize-handle.ne{cursor:ne-resize;right:-12px;top:-12px}.resize-handle.sw{bottom:-12px;cursor:sw-resize;left:-12px}.resize-handle.se{bottom:-12px;cursor:se-resize;right:-12px}.resize-handle.n{cursor:n-resize;top:-12px}.resize-handle.n,.resize-handle.s{left:50%;transform:translateX(-50%)}.resize-handle.s{bottom:-12px;cursor:s-resize}.resize-handle.w{cursor:w-resize;left:-12px}.resize-handle.e,.resize-handle.w{top:50%;transform:translateY(-50%)}.resize-handle.e{cursor:e-resize;right:-12px}.design-image{height:auto;image-rendering:-webkit-optimize-contrast;image-rendering:crisp-edges;max-width:none;pointer-events:none;transform:translateZ(0);-webkit-user-select:none;user-select:none;width:auto;will-change:auto}.selection-overlay{height:100%;left:0;pointer-events:none;position:absolute;top:0;width:100%;z-index:20}.selection-overlay.selecting{cursor:crosshair;pointer-events:all}.selection-box{background-color:#ff00001a;border:2px solid red;pointer-events:none;position:absolute}.issues-panel{background-color:#f8f9fa;border-left:1px solid #ddd;display:flex;flex-direction:column;min-width:300px;width:320px}.issues-header{background-color:#fff;border-bottom:1px solid #ddd;justify-content:space-between;min-height:40px;padding:8px 15px}.header-buttons,.issues-header{align-items:center;display:flex}.header-buttons{gap:10px}.issues-title{font-size:16px;font-weight:600}.export-button{background-color:#17a2b8;border:none;border-radius:4px;color:#fff;cursor:pointer;font-size:12px;padding:8px 16px}.export-button:hover{background-color:#138496}.ai-review-button{background:linear-gradient(135deg,#667eea,#764ba2);border:none;border-radius:4px;box-shadow:0 2px 4px #667eea4d;color:#fff;cursor:pointer;font-size:12px;height:36px;padding:8px 16px;transition:all .3s ease}.ai-review-button:hover:not(:disabled){background:linear-gradient(135deg,#764ba2,#667eea);box-shadow:0 4px 8px #667eea66;transform:translateY(-1px)}.ai-review-button:disabled{background-color:#6c757d;box-shadow:none;color:#adb5bd;cursor:not-allowed;transform:none}.issues-list{flex:1 1;overflow-y:auto;padding:15px}.issues-list::-webkit-scrollbar{background:#0000;width:0}.issues-list::-webkit-scrollbar-thumb{background:#0000}.issue-item{background-color:#fff;border:1px solid #ddd;border-radius:4px;margin-bottom:15px;padding:15px}.issue-screenshot{border:1px solid #eee;margin-bottom:10px;max-height:150px;object-fit:contain;width:100%}.issue-description,.issue-suggestion{margin-bottom:8px}.issue-label{color:#666;font-size:12px;margin-bottom:4px}.issue-text{background-color:#f8f9fa;border:1px solid #ddd;border-radius:4px;font-size:13px;min-height:60px;padding:8px}.issue-actions{display:flex;gap:8px;margin-top:10px}.delete-button,.edit-button{border:none;border-radius:3px;cursor:pointer;font-size:11px;padding:4px 8px}.edit-button{background-color:#ffc107;color:#212529}.delete-button{background-color:#dc3545;color:#fff}.modal-overlay{align-items:center;background-color:#00000080;bottom:0;display:flex;justify-content:center;left:0;position:fixed;right:0;top:0;z-index:1000}.modal{background-color:#fff;border-radius:8px;max-height:80vh;max-width:600px;overflow-y:auto;padding:24px;width:90%}.modal-title{font-size:18px;font-weight:600;margin-bottom:20px}.modal-screenshot{border:1px solid #ddd;max-height:200px;object-fit:contain;width:100%}.form-group,.modal-screenshot{margin-bottom:20px}.form-label{display:block;font-size:14px;font-weight:500;margin-bottom:8px}.form-textarea{border:1px solid #ddd;border-radius:4px;font-family:inherit;font-size:13px;min-height:80px;padding:12px;resize:vertical;width:100%}.form-placeholder{color:#999;font-size:12px;margin-top:4px}.modal-actions{display:flex;gap:12px;justify-content:flex-end;margin-top:24px}.modal-button{border:none;border-radius:4px;cursor:pointer;font-size:14px;padding:10px 20px}.modal-button.primary{background-color:#007bff;color:#fff}.modal-button.secondary{background-color:#6c757d;color:#fff}.file-input{display:none}.cors-notice{background-color:#fff3cd;border:1px solid #ffeaa7;border-radius:4px;color:#856404;font-size:12px;margin-bottom:10px;padding:10px}.cors-notice strong{color:#d63384}.empty-preview-placeholder{align-items:center;background:linear-gradient(135deg,#f8f9fa,#e9ecef);border:2px dashed #dee2e6;border-radius:8px;display:flex;height:100%;justify-content:center;min-height:500px;width:100%}.placeholder-content{max-width:500px;padding:40px 20px;text-align:center}.placeholder-content h3{color:#495057;font-size:24px;font-weight:600;margin-bottom:16px}.placeholder-content p{color:#6c757d;font-size:16px;line-height:1.5;margin-bottom:12px}.placeholder-example{color:#868e96;font-size:14px;font-style:italic;margin-bottom:30px}.placeholder-steps{display:flex;flex-direction:column;gap:12px;margin-top:30px}.step{background-color:#fff;border-left:4px solid #007bff;border-radius:6px;box-shadow:0 2px 4px #0000001a;color:#495057;font-size:14px;font-weight:500;padding:12px 20px}.placeholder-notice{background-color:#fff3cd;border:1px solid #ffeaa7;border-left:4px solid #f39c12;border-radius:6px;margin-top:30px;min-width:480px;padding:15px 20px}.placeholder-notice p{color:#856404;font-size:13px;font-weight:500;margin:0;overflow:hidden;text-align:center;text-overflow:ellipsis;white-space:nowrap}.url-restrictions{background-color:#fff3cd;border:1px solid #ffeaa7;border-left:4px solid #f39c12;border-radius:6px;margin-top:25px;padding:18px 20px;text-align:left}.restriction-title{color:#856404;font-size:14px;font-weight:600;margin:0 0 12px}.restriction-list{list-style-type:disc;margin:0;padding-left:20px}.restriction-list li{color:#856404;font-size:13px;line-height:1.4;margin-bottom:6px}.restriction-list li:last-child{margin-bottom:0}.crop-modal{background-color:#fff;border-radius:8px;flex-direction:column;height:80vh;max-height:90vh;max-width:90vw;padding:24px;width:80vw}.crop-modal,.crop-preview{display:flex;overflow:auto}.crop-preview{align-items:center;border:1px solid #ddd;border-radius:4px;cursor:crosshair;flex:1 1;justify-content:center;margin:20px 0;min-height:300px;position:relative}.crop-preview-img{display:block;max-height:100%;max-width:100%;object-fit:contain;pointer-events:none;-webkit-user-select:none;user-select:none}.crop-selection-box{background-color:#007bff1a;border:2px solid #007bff;pointer-events:none;position:absolute;z-index:10}.crop-instructions{background-color:#e3f2fd;border:1px solid #bbdefb;border-radius:4px;margin-bottom:20px;padding:16px}.crop-instructions p{color:#1976d2;font-size:14px;margin:0 0 8px}.crop-instructions p:last-child{color:#1565c0;font-size:13px;margin-bottom:0}.modal-button:disabled{background-color:#6c757d;color:#adb5bd;cursor:not-allowed;opacity:.65}.screenshot-tip{animation:slideInRight .3s ease-out;position:fixed;right:20px;top:80px;z-index:1000}.tip-content{align-items:center;background:linear-gradient(135deg,#4caf50,#45a049);border-left:4px solid #2e7d32;border-radius:8px;box-shadow:0 4px 12px #00000026;color:#fff;display:flex;font-size:14px;justify-content:space-between;max-width:450px;padding:12px 16px}.tip-text{flex:1 1;line-height:1.4}.tip-actions{align-items:center;display:flex;gap:8px}.tip-button{background:#ffffffe6;border:none;border-radius:4px;color:#2e7d32;cursor:pointer;font-size:12px;font-weight:600;padding:6px 12px;transition:all .2s ease}.tip-button:hover{background:#fff;transform:translateY(-1px)}.tip-close{align-items:center;background:#fff3;border:none;border-radius:50%;color:#fff;cursor:pointer;display:flex;font-size:16px;font-weight:700;height:24px;justify-content:center;transition:background-color .2s ease;width:24px}.tip-close:hover{background:#ffffff4d}.paste-screenshot-section{background:linear-gradient(135deg,#e3f2fd,#f1f8e9);border:2px dashed #2196f3;border-radius:8px;margin-bottom:20px;padding:20px;text-align:center}.paste-instruction{color:#1976d2;font-size:14px;font-weight:500;margin-bottom:15px}.paste-screenshot-button{background:linear-gradient(135deg,#2196f3,#1976d2);border:none;border-radius:6px;box-shadow:0 2px 8px #2196f34d;color:#fff;cursor:pointer;font-size:14px;font-weight:600;padding:12px 24px;transition:all .3s ease}.paste-screenshot-button:hover{background:linear-gradient(135deg,#1976d2,#1565c0);box-shadow:0 4px 12px #2196f366;transform:translateY(-2px)}.ai-modal{background-color:#fff;border-radius:12px;box-shadow:0 10px 40px #0003;max-height:90vh;max-width:800px;overflow-y:auto;padding:24px;width:90%}.ai-upload-section{margin-bottom:24px}.upload-tabs{margin-bottom:20px}.tab-content h4{color:#495057;font-size:18px;font-weight:600;margin-bottom:8px}.upload-description{color:#6c757d;font-size:14px;line-height:1.5;margin-bottom:20px}.drag-upload-area{background-color:#f8f9fa;border:2px dashed #dee2e6;border-radius:8px;cursor:pointer;margin-bottom:16px;padding:40px 20px;transition:all .3s ease}.drag-upload-area:hover{background-color:#f3f4ff;border-color:#667eea}.drag-upload-area.dragging{background:linear-gradient(135deg,#f3f4ff,#e8f0ff);border-color:#667eea;transform:scale(1.02)}.upload-content{align-items:center;display:flex;flex-direction:column;text-align:center}.upload-icon{font-size:48px;margin-bottom:16px;opacity:.7}.upload-text{color:#495057}.upload-text>div:first-child{font-size:16px;font-weight:500;margin-bottom:8px}.upload-hint{color:#6c757d;font-size:12px;margin-bottom:4px}.folder-upload-section{margin-top:16px}.folder-upload{background:linear-gradient(135deg,#fff3e0,#ffecb3);border:2px dashed #ffb74d;border-radius:8px;cursor:pointer;padding:20px;transition:all .3s ease}.folder-upload:hover{background:linear-gradient(135deg,#ffecb3,#ffd54f);border-color:#ff9800;transform:scale(1.02)}.folder-upload-content{align-items:center;color:#f57c00;display:flex;flex-direction:column;text-align:center}.folder-icon{font-size:32px;margin-bottom:8px}.folder-upload-content>div:nth-child(2){font-weight:600;margin-bottom:4px}.folder-hint{font-size:12px;opacity:.8}.uploaded-files{background-color:#f8f9fa;border:1px solid #e9ecef;border-radius:8px;padding:16px}.uploaded-files h4{color:#495057;font-size:16px;font-weight:600;margin-bottom:12px}.files-grid{grid-gap:12px;display:grid;gap:12px;grid-template-columns:repeat(auto-fill,minmax(120px,1fr))}.file-preview{background-color:#fff;border:1px solid #dee2e6;border-radius:6px;padding:8px;position:relative;transition:all .2s ease}.file-preview:hover{border-color:#667eea;box-shadow:0 2px 8px #0000001a;transform:translateY(-2px)}.preview-thumbnail{border-radius:4px;height:80px;margin-bottom:8px;object-fit:cover;width:100%}.file-info{text-align:center}.file-name{color:#495057;font-size:11px;font-weight:500;margin-bottom:2px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.file-size{color:#6c757d;font-size:10px}.remove-file{align-items:center;background:#dc3545;border:none;border-radius:50%;box-shadow:0 2px 4px #0003;color:#fff;cursor:pointer;display:flex;font-size:12px;height:20px;justify-content:center;position:absolute;right:-6px;top:-6px;width:20px}.remove-file:hover{background:#c82333;transform:scale(1.1)}.ai-tech-info{background:linear-gradient(135deg,#e3f2fd,#f1f8e9);border:1px solid #bbdefb;border-radius:8px;margin-bottom:24px;padding:20px}.ai-tech-info h4{color:#1976d2;font-size:16px;font-weight:600;margin-bottom:16px}.tech-stack{grid-gap:12px;display:grid;gap:12px;grid-template-columns:repeat(auto-fit,minmax(200px,1fr))}.tech-item{background-color:#fff;border:1px solid #e1f5fe;border-radius:6px;padding:12px;transition:all .2s ease}.tech-item:hover{border-color:#81c784;box-shadow:0 2px 8px #0000001a;transform:translateY(-2px)}.tech-name{color:#1976d2;display:block;font-size:13px;font-weight:600;margin-bottom:4px}.tech-desc{color:#4caf50;display:block;font-size:11px;line-height:1.3}.ai-processing{padding:40px 20px;text-align:center}.processing-header{margin-bottom:30px}.processing-icon{animation:spin 2s linear infinite;font-size:48px;margin-bottom:16px}@keyframes spin{0%{transform:rotate(0deg)}to{transform:rotate(1turn)}}.processing-header h4{color:#495057;font-size:20px;font-weight:600}.progress-container{margin-bottom:30px}.progress-bar{background-color:#e9ecef;border-radius:10px;box-shadow:inset 0 1px 3px #0000001a;height:20px;margin-bottom:12px;overflow:hidden}.progress-fill{background:linear-gradient(135deg,#667eea,#764ba2);border-radius:10px;height:100%;position:relative;transition:width .5s ease}.progress-fill:after{animation:shimmer 2s infinite;background:linear-gradient(90deg,#0000,#ffffff4d,#0000);bottom:0;content:"";left:0;position:absolute;right:0;top:0}@keyframes shimmer{0%{transform:translateX(-100%)}to{transform:translateX(100%)}}.progress-text{color:#495057;font-size:14px;font-weight:500;margin-bottom:4px}.progress-percentage{color:#6c757d;font-size:18px;font-weight:600}.processing-info{color:#6c757d;font-size:14px;line-height:1.5}.processing-info p{margin-bottom:8px}.processing-info p:last-child{margin-bottom:0}.issue-item.ai-generated{background:linear-gradient(135deg,#f8f9ff,#f3f4ff);border-left:4px solid #667eea;position:relative}.ai-badge{background:linear-gradient(135deg,#667eea,#764ba2);border-radius:0 4px 0 8px;box-shadow:0 2px 4px #0000001a;color:#fff;font-size:10px;font-weight:600;padding:4px 8px;position:absolute;right:-1px;top:-1px;z-index:1}@media (max-width:768px){.ai-modal{max-height:95vh;padding:16px;width:95%}.tech-stack{grid-template-columns:1fr}.files-grid{grid-template-columns:repeat(auto-fill,minmax(100px,1fr))}.drag-upload-area{padding:30px 15px}.upload-icon{font-size:36px}}.image-enlargement-overlay{align-items:center;backdrop-filter:blur(3px);-webkit-backdrop-filter:blur(3px);background:#000c;bottom:0;display:flex;justify-content:center;left:0;position:fixed;right:0;top:0;z-index:10000}.image-enlargement-container{animation:enlargeIn .3s ease-out;background:#fff;border-radius:8px;box-shadow:0 20px 50px #0000004d;max-height:90vh;max-width:90vw;overflow:hidden;position:relative}@keyframes enlargeIn{0%{opacity:0;transform:scale(.8)}to{opacity:1;transform:scale(1)}}.image-close-button{background:#0009;border:none;border-radius:50%;color:#fff;cursor:pointer;font-size:18px;height:30px;line-height:1;position:absolute;right:10px;top:10px;transition:background .2s;width:30px;z-index:1}.image-close-button:hover{background:#000c}.enlarged-image{cursor:pointer;display:block;max-height:80vh;max-width:100%;object-fit:contain}.image-enlargement-tip{background:#f5f5f5;color:#666;font-size:12px;padding:10px 15px;text-align:center}.issue-screenshot{border-radius:4px;cursor:pointer;transition:transform .2s,box-shadow .2s}.issue-screenshot:hover{box-shadow:0 4px 12px #00000026;transform:scale(1.02)}.modal-screenshot{border-radius:4px;cursor:pointer;transition:transform .2s,box-shadow .2s}.modal-screenshot:hover{box-shadow:0 4px 12px #00000026;transform:scale(1.02)}.multi-page-controls{align-items:center;display:flex;gap:10px;margin-left:20px}.mode-toggle-button{background:#f8f9fa;border:1px solid #dee2e6;border-radius:4px;cursor:pointer;font-size:12px;padding:8px 12px;transition:all .2s}.mode-toggle-button:hover{background:#e9ecef}.mode-toggle-button.active{background:#28a745;border-color:#28a745;color:#fff}.capture-button{background:#007bff;border:none;border-radius:4px;color:#fff;cursor:pointer;font-size:12px;padding:6px 10px;transition:background .2s}.capture-button:hover{background:#0056b3}.capture-button:disabled{background:#6c757d;cursor:not-allowed}.force-detect-button{background:#ffc107;border:none;border-radius:4px;color:#212529;cursor:pointer;font-size:12px;padding:6px 10px;transition:background .2s}.force-detect-button:hover{background:#e0a800}.force-detect-button:disabled{background:#6c757d;color:#fff;cursor:not-allowed}.page-count-info{color:#6c757d;font-size:12px;font-weight:500}.page-change-notification{animation:slideInRight .3s ease-out;background:#007bff;border-radius:6px;box-shadow:0 4px 12px #007bff4d;color:#fff;padding:12px 16px;position:fixed;right:20px;top:70px;z-index:1000}@keyframes slideInRight{0%{opacity:0;transform:translateX(100%)}to{opacity:1;transform:translateX(0)}}.notification-content{align-items:center;display:flex;gap:8px}.notification-icon{font-size:16px}.notification-text{font-size:13px;font-weight:500}.multi-page-info-panel{background:#fff;border:1px solid #dee2e6;border-radius:8px;bottom:20px;box-shadow:0 4px 20px #0000001a;left:20px;max-height:300px;overflow:hidden;position:fixed;right:20px;z-index:999}.info-panel-header{align-items:center;background:#f8f9fa;border-bottom:1px solid #dee2e6;display:flex;justify-content:space-between;padding:12px 16px}.info-panel-header h4{color:#495057;font-size:14px;font-weight:600;margin:0}.panel-header-actions{align-items:center;display:flex;gap:8px}.batch-ai-button{background:#28a745;border:none;border-radius:4px;color:#fff;cursor:pointer;font-size:12px;padding:6px 10px;transition:background .2s}.batch-ai-button:hover{background:#218838}.batch-ai-button:disabled{background:#6c757d;cursor:not-allowed}.panel-toggle{background:none;border:none;border-radius:4px;color:#6c757d;cursor:pointer;font-size:12px;padding:4px 8px;transition:background .2s}.panel-toggle:hover{background:#e9ecef}.pages-grid{grid-gap:12px;display:grid;gap:12px;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));max-height:200px;overflow-y:auto;padding:16px}.page-card{background:#f8f9fa;border:1px solid #e9ecef;border-radius:6px;display:flex;gap:12px;padding:8px;transition:transform .2s,box-shadow .2s}.page-card:hover{box-shadow:0 2px 8px #0000001a;transform:translateY(-1px)}.page-thumbnail{background:#dee2e6;border-radius:4px;flex-shrink:0;height:45px;overflow:hidden;width:60px}.page-thumbnail img{cursor:pointer;height:100%;object-fit:cover;width:100%}.page-info{flex:1 1;min-width:0}.page-title{color:#212529;font-size:12px;font-weight:600}.page-title,.page-url{margin-bottom:2px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.page-url{color:#6c757d;font-size:10px}.page-type{color:#495057}.match-info,.page-type{font-size:10px;margin-bottom:4px}.match-info.success{color:#28a745}.match-info.no-match{color:#dc3545}.page-actions{display:flex;gap:4px}.mini-button{background:#007bff;border:none;border-radius:3px;color:#fff;cursor:pointer;font-size:10px;padding:2px 6px;transition:background .2s}.mini-button:hover{background:#0056b3}.mini-button:disabled{background:#6c757d;cursor:not-allowed}.matched-design-tag,.page-info-tag{background:#f8f9fa;border-radius:3px;color:#6c757d;display:inline-block;font-size:11px;margin-right:6px;margin-top:4px;padding:2px 6px}.page-info-tag{border-left:3px solid #007bff}.matched-design-tag{border-left:3px solid #28a745}.video-tutorial-section{background:linear-gradient(135deg,#667eea,#764ba2);border-radius:12px;margin:20px 0;padding:30px 20px;text-align:center}.video-tutorial-btn{align-items:center;background:#fff;border:none;border-radius:8px;box-shadow:0 4px 12px #0000001a;color:#667eea;cursor:pointer;display:inline-flex;font-size:16px;font-weight:600;gap:8px;padding:12px 24px;transition:all .3s ease}.video-tutorial-btn:hover{background:#f8f9ff;box-shadow:0 6px 20px #00000026;transform:translateY(-2px)}.tutorial-icon{height:20px;width:20px}.tutorial-desc{color:#fff!important;font-size:14px;margin-top:12px;opacity:1!important}.video-tutorial-modal{background:#fff;border-radius:12px;box-shadow:0 20px 60px #0000004d;max-height:90vh;max-width:800px;overflow:hidden;width:90%}.video-tutorial-header{align-items:center;background:#f8f9fa;border-bottom:1px solid #eee;display:flex;justify-content:space-between;padding:20px 24px}.video-tutorial-header h3{color:#333;font-size:18px;margin:0}.modal-close-btn{align-items:center;background:none;border:none;border-radius:50%;color:#666;cursor:pointer;display:flex;font-size:24px;height:32px;justify-content:center;padding:0;transition:all .2s ease;width:32px}.modal-close-btn:hover{background:#f0f0f0;color:#333}.video-tutorial-content{padding:24px}.video-description{color:#666;line-height:1.6;margin-top:16px;text-align:center}.video-tutorial-actions{background:#f8f9fa;border-top:1px solid #eee;padding:16px 24px;text-align:center}
/*# sourceMappingURL=main.1f6eb440.css.map*/