*{margin:0;padding:0;box-sizing:border-box}body{font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif;background:#0f172a;color:#e2e8f0;min-height:100vh}.container{max-width:960px;margin:0 auto;padding:2rem 1rem}.app-header{display:flex;justify-content:space-between;align-items:flex-start;margin-bottom:1rem}.app-header>div:first-child{flex:1}.user-info{display:flex;align-items:center;gap:.75rem;color:#94a3b8;font-size:.85rem;white-space:nowrap;padding-top:.5rem}.logout-btn{padding:.35rem .75rem;background:transparent;border:1px solid #475569;color:#94a3b8;border-radius:4px;cursor:pointer;font-size:.8rem}.logout-btn:hover{background:#1e293b;color:#f1f5f9}h1{text-align:center;font-size:1.8rem;margin-bottom:.5rem;color:#38bdf8}.subtitle{text-align:center;color:#64748b;margin-bottom:1.5rem;font-size:.9rem}.mode-tabs{display:flex;gap:0;margin-bottom:1.5rem;background:#1e293b;border-radius:8px;padding:4px}.mode-tab{flex:1;padding:.6rem 1rem;background:transparent;color:#64748b;border:none;border-radius:6px;font-size:.9rem;font-weight:600;cursor:pointer;transition:background .2s,color .2s}.mode-tab:hover{color:#94a3b8}.mode-tab.active{background:#0ea5e9;color:#fff}.db-form{border:2px solid #334155;border-radius:12px;padding:1.25rem;display:flex;flex-direction:column;gap:.6rem}.db-form-label{font-weight:600;color:#94a3b8;font-size:.9rem;margin-bottom:.2rem}.db-form-row{display:flex;gap:.5rem}.db-form input{width:100%;padding:.55rem .75rem;background:#0f172a;border:1px solid #334155;border-radius:6px;color:#e2e8f0;font-size:.85rem;transition:border-color .2s}.db-form input:focus{outline:none;border-color:#38bdf8}.db-form input::placeholder{color:#475569}.upload-area{display:grid;grid-template-columns:1fr 1fr;gap:1rem;margin-bottom:1.5rem}.upload-box{border:2px dashed #334155;border-radius:12px;padding:1.5rem;text-align:center;transition:border-color .2s,background .2s;cursor:pointer;position:relative}.upload-box:hover,.upload-box.dragover{border-color:#38bdf8;background:#1e293b}.upload-box.has-file{border-color:#22c55e;background:#0f291a}.upload-box label{font-weight:600;color:#94a3b8;display:block;margin-bottom:.5rem;cursor:pointer}.upload-box .filename{color:#22c55e;font-size:.85rem;word-break:break-all}.upload-box .filename.empty{color:#475569}.upload-box .hint{color:#475569;font-size:.8rem;margin-top:.5rem}.upload-box input[type=file]{position:absolute;inset:0;opacity:0;cursor:pointer}.btn{display:block;width:100%;padding:.85rem;background:#0ea5e9;color:#fff;border:none;border-radius:8px;font-size:1rem;font-weight:600;cursor:pointer;transition:background .2s}.btn:hover{background:#0284c7}.btn:disabled{background:#334155;color:#64748b;cursor:not-allowed}.btn.loading{position:relative;color:transparent}.btn.loading:after{content:"";position:absolute;top:50%;left:50%;width:20px;height:20px;margin:-10px 0 0 -10px;border:3px solid #fff;border-top-color:transparent;border-radius:50%;animation:spin .6s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}.filters{display:flex;align-items:center;gap:1rem;flex-wrap:wrap;background:#1e293b;border-radius:8px;padding:.75rem 1rem;margin-bottom:1.5rem}.filters-label{font-size:.8rem;font-weight:600;color:#64748b;text-transform:uppercase;letter-spacing:.05em}.filter-checkbox{display:flex;align-items:center;gap:.4rem;cursor:pointer;font-size:.85rem;-webkit-user-select:none;user-select:none}.filter-checkbox input[type=checkbox]{accent-color:#38bdf8;width:16px;height:16px;cursor:pointer}.filter-checkbox.red span{color:#f87171}.filter-checkbox.green span{color:#4ade80}.filter-checkbox.yellow span{color:#facc15}.filter-checkbox.muted span{color:#9ca3af}.btn-download{margin-left:auto;padding:.4rem .9rem;background:#0ea5e9;color:#fff;border:none;border-radius:6px;font-size:.8rem;font-weight:600;cursor:pointer;transition:background .2s;white-space:nowrap}.btn-download:hover{background:#0284c7}.btn-download:disabled{background:#334155;color:#64748b;cursor:not-allowed}.results{margin-top:2rem}.summary{background:#1e293b;border-radius:10px;padding:1.25rem;margin-bottom:1.5rem;display:grid;grid-template-columns:repeat(auto-fit,minmax(140px,1fr));gap:1rem}.stat{text-align:center}.stat .num{font-size:1.6rem;font-weight:700;color:#38bdf8}.stat .lbl{font-size:.75rem;color:#64748b;text-transform:uppercase;letter-spacing:.05em}.btn-refresh{padding:.4rem 1rem;background:#334155;color:#94a3b8;border:1px solid #475569;border-radius:6px;font-size:.8rem;font-weight:600;cursor:pointer;transition:background .2s,color .2s}.btn-refresh:hover{background:#475569;color:#e2e8f0}.btn-refresh:disabled{opacity:.5;cursor:not-allowed}.section{margin-bottom:1.5rem}.section-title-row{display:flex;align-items:center;justify-content:space-between;gap:.5rem;margin-bottom:.75rem}.section-title-row .section-title{margin-bottom:0;flex:1}.section-title{font-size:.85rem;font-weight:700;text-transform:uppercase;letter-spacing:.05em;margin-bottom:.75rem;padding-bottom:.4rem;border-bottom:1px solid #1e293b}.section-title.clickable{cursor:pointer;-webkit-user-select:none;user-select:none}.section-title.clickable:hover{opacity:.8}.collapse-arrow{display:inline-block;font-size:.65rem;margin-right:.5rem;transition:transform .2s}.collapse-arrow.open{transform:rotate(90deg)}.section-title.red{color:#f87171;border-color:#7f1d1d}.section-title.green{color:#4ade80;border-color:#14532d}.section-title.yellow{color:#facc15;border-color:#713f12}.section-title.cyan{color:#22d3ee;border-color:#164e63}.table-group{margin-bottom:1rem}.table-name-row{display:flex;align-items:center;justify-content:space-between;gap:.5rem;margin-bottom:.4rem}.table-name{font-weight:600;color:#38bdf8;font-size:.95rem;padding:.4rem .6rem;background:#1e293b;border-radius:6px;flex:1}.btn-download-sm{padding:.3rem .7rem;background:#334155;color:#94a3b8;border:1px solid #475569;border-radius:6px;font-size:.75rem;font-weight:600;cursor:pointer;transition:background .2s,color .2s;white-space:nowrap}.btn-download-sm:hover{background:#475569;color:#e2e8f0}.diff-row{display:grid;grid-template-columns:24px 1fr;gap:.5rem;padding:.35rem .6rem .35rem 1.2rem;font-size:.85rem;border-bottom:1px solid #1e293b;align-items:center}.diff-row.with-download{grid-template-columns:24px 1fr auto}.diff-row:last-child{border-bottom:none}.btn-download-xs{padding:.15rem .5rem;background:transparent;color:#475569;border:1px solid #334155;border-radius:4px;font-size:.7rem;font-weight:600;cursor:pointer;transition:background .2s,color .2s,border-color .2s;white-space:nowrap}.btn-download-xs:hover{background:#334155;color:#e2e8f0;border-color:#475569}.diff-icon{font-weight:700;font-size:.95rem}.diff-icon.removed{color:#f87171}.diff-icon.added{color:#4ade80}.diff-icon.changed{color:#facc15}.diff-detail{color:#cbd5e1}.diff-detail .col-name{font-weight:600;color:#e2e8f0}.diff-detail .meta{color:#64748b;font-size:.8rem}.diff-detail .arrow{color:#facc15;margin:0 .3rem}.tag{display:inline-block;padding:.1rem .4rem;border-radius:4px;font-size:.75rem;font-weight:600}.tag.removed{background:#7f1d1d;color:#fca5a5}.tag.added{background:#14532d;color:#86efac}.no-diff{text-align:center;color:#4ade80;font-weight:600;font-size:1.1rem;padding:2rem;background:#0f291a;border-radius:10px}.error-msg{background:#7f1d1d;color:#fca5a5;padding:1rem;border-radius:8px;margin-top:1rem}.sql-actions{display:flex;gap:.4rem}.sql-table-group{margin-bottom:.75rem}.sql-table-group .table-name-row{margin-bottom:0}.sql-table-group .sql-block{margin-top:.4rem}.table-name.clickable{cursor:pointer;-webkit-user-select:none;user-select:none}.table-name.clickable:hover{opacity:.8}.table-name .collapse-arrow{font-size:.6rem;margin-right:.4rem}.sql-block{background:#0c1222;border:1px solid #1e293b;border-radius:8px;padding:1rem;font-family:SF Mono,Fira Code,Cascadia Code,monospace;font-size:.8rem;color:#94a3b8;line-height:1.6;overflow-x:auto;white-space:pre;tab-size:2}.sync-controls{display:flex;align-items:center;justify-content:space-between;gap:.75rem;padding:.6rem .75rem;background:#1e293b;border-radius:8px;margin-bottom:.75rem}.sync-select-actions{display:flex;align-items:center;gap:.5rem}.sync-count{font-size:.75rem;color:#64748b;margin-left:.25rem}.sql-checkbox{display:flex;align-items:center;cursor:pointer;flex-shrink:0}.sql-checkbox input[type=checkbox]{accent-color:#22d3ee;width:16px;height:16px;cursor:pointer}.tag.changed{background:#713f12;color:#facc15}.stmt-list{margin-top:.3rem;margin-left:1.8rem}.stmt-row{display:flex;align-items:flex-start;gap:.5rem;padding:.3rem .5rem;border-bottom:1px solid #1e293b}.stmt-row:last-child{border-bottom:none}.stmt-row .tag{flex-shrink:0;min-width:56px;text-align:center}.stmt-sql{font-family:SF Mono,Fira Code,Cascadia Code,monospace;font-size:.78rem;color:#94a3b8;white-space:pre-wrap;word-break:break-all;margin:0;line-height:1.5}.btn-sync{padding:.3rem .9rem;background:#22c55e;color:#fff;border:none;border-radius:6px;font-size:.75rem;font-weight:600;cursor:pointer;transition:background .2s;white-space:nowrap}.btn-sync:hover{background:#16a34a}.btn-sync:disabled{background:#334155;color:#64748b;cursor:not-allowed}.btn-sync.loading{opacity:.7}.sync-results{margin-top:1rem;border:1px solid #164e63;border-radius:8px;padding:.75rem}.sync-row{display:flex;align-items:flex-start;gap:.5rem;padding:.4rem .5rem;font-size:.8rem;border-bottom:1px solid #1e293b}.sync-row:last-child{border-bottom:none}.sync-icon{font-weight:700;font-size:.9rem;flex-shrink:0}.sync-row.success .sync-icon{color:#4ade80}.sync-row.failed .sync-icon{color:#f87171}.sync-row.skipped .sync-icon{color:#facc15}.sync-skipped{color:#facc15!important}.sync-sql{color:#94a3b8;font-family:SF Mono,Fira Code,monospace;font-size:.75rem;word-break:break-all}.sync-error{color:#fca5a5;font-size:.75rem;margin-left:auto;flex-shrink:0}.sync-summary{font-size:.75rem;font-weight:400;text-transform:none;letter-spacing:normal}@media(max-width:600px){.upload-area{grid-template-columns:1fr}}
