*{margin:0;padding:0;box-sizing:border-box}:root{font-family:system-ui,Avenir,Helvetica,Arial,sans-serif;line-height:1.5;font-weight:400;color-scheme:light;color:#1f2937;background-color:#fff;font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}body{margin:0;padding:0;min-width:320px;min-height:100vh}#root{width:100%;height:100%}a{font-weight:500;color:#646cff;text-decoration:inherit}a:hover{color:#535bf2}button{border-radius:8px;border:1px solid transparent;padding:.6em 1.2em;font-size:1em;font-weight:500;font-family:inherit;background-color:#1a1a1a;cursor:pointer;transition:border-color .25s;color:#fff}button:hover{border-color:#646cff}button:focus,button:focus-visible{outline:4px auto -webkit-focus-ring-color}h1{font-size:3.2em;line-height:1.1}input{font-family:inherit}.header{display:flex;align-items:center;justify-content:space-between;padding:1rem 2rem;background-color:#1e7ec4;gap:2rem}.header-logo{padding:.5rem 1rem;background-color:#9ca3af;border-radius:.5rem;color:#374151;font-weight:600;font-size:.875rem;min-width:80px;text-align:center}.header-search{flex:1;max-width:400px}.search-input{width:100%;padding:.75rem 1.25rem;border:none;border-radius:2rem;font-size:1rem;outline:none}.header-actions{display:flex;gap:1rem}.header-button{background-color:transparent;border:none;color:#fff;font-size:1.5rem;cursor:pointer;padding:.5rem;display:flex;align-items:center;justify-content:center;width:2.5rem;height:2.5rem;border-radius:.375rem}.header-button:hover{background-color:#ffffff1a}.main-content{flex:1;padding:2rem;display:flex;flex-direction:column;gap:2rem}.platforms-list{display:flex;flex-direction:column;gap:1.5rem}.platform-card{display:flex;flex-wrap:wrap;align-items:center;gap:1.5rem;padding:1.25rem;background-color:#cce5f4;border-radius:.75rem}.platform-header{display:flex;align-items:center;gap:1rem;min-width:250px;flex:0 0 auto}.platform-stats{display:flex;gap:3rem;flex:1 1 auto;min-width:300px}.card-actions{display:flex;align-items:center;gap:.5rem;flex:0 0 auto}.platform-activity{flex:0 1 100%;width:100%;margin-top:.5rem}.sync-indicator{width:.75rem;height:.75rem;border-radius:50%;flex-shrink:0}.platform-icon{font-size:2.5rem;flex-shrink:0;display:flex;align-items:center;justify-content:center;width:3rem;height:3rem}.platform-icon-img{width:100%;height:100%;object-fit:contain}.platform-name{margin:0;font-size:1.125rem;font-weight:600;color:#1f2937}.platform-stats{display:flex;gap:10px;flex:1;justify-content:center}.stat-column{display:flex;flex-direction:column;gap:10px}.stat-item{display:flex;align-items:center;gap:6px;font-size:14px;color:#374151;background-color:#fff;padding:5px 10px;border-radius:20px}.stat-dot{font-size:.75rem}.stat-label{font-weight:500}.card-actions{display:flex;align-items:center;gap:.5rem;flex-shrink:0}.dropdown-button{background-color:transparent;border:none;color:#374151;font-size:1.25rem;cursor:pointer;padding:.5rem;display:flex;align-items:center;justify-content:center;flex-shrink:0;transition:transform .2s ease}.dropdown-button:hover{color:#1f2937}.dropdown-button.expanded{transform:rotate(180deg)}.reconcile-button{padding:.625rem 1rem;border:none;border-radius:.375rem;font-weight:600;cursor:pointer;font-size:.875rem;transition:opacity .2s;white-space:nowrap}.reconcile-button.synced{background-color:#22c55e;color:#fff}.reconcile-button.not-synced{background-color:#f59e0b;color:#fff}.reconcile-button:hover{opacity:.9}.platform-activity{background-color:#fff;border-radius:.5rem;padding:1rem;margin-top:.5rem}.activity-title{margin:0 0 1rem;font-size:.95rem;font-weight:600;color:#1f2937}.activity-table{width:100%;border-collapse:collapse}.activity-row{border:none}.activity-row.synced{background-color:#bbf7d0}.activity-row.synced:not(:last-child){border-bottom:1px solid #a7f3d0}.activity-row.pending{background-color:#fecaca}.activity-row.pending:not(:last-child){border-bottom:1px solid #fca5a5}.activity-row td{padding:.75rem;font-size:.9rem}.activity-row.synced td{color:#1f2937}.activity-row.pending td{color:#7f1d1d}.activity-type{font-weight:500;padding-left:1rem}.activity-timestamp{text-align:center;font-weight:500}.activity-status-cell{display:flex;align-items:center;justify-content:flex-end;gap:.75rem;padding-right:1rem}.activity-status{font-weight:500}.activity-row.synced .activity-status{color:#166534}.activity-row.pending .activity-status{color:#991b1b}.activity-reconcile-button{padding:.5rem .875rem;background-color:#f59e0b;color:#fff;border:none;border-radius:.375rem;font-weight:600;font-size:.8rem;cursor:pointer;transition:opacity .2s;white-space:nowrap}.activity-reconcile-button:hover{opacity:.9}.modal-overlay{position:fixed;inset:0;background-color:#00000080;display:flex;align-items:center;justify-content:center;z-index:1000}.modal-content{background-color:#fff;border-radius:.75rem;padding:2rem;max-width:500px;width:90%;max-height:80vh;overflow-y:auto;box-shadow:0 10px 40px #0003}.modal-title{margin:0 0 .5rem;font-size:1.25rem;font-weight:700;color:#1f2937}.modal-description{margin:0 0 1.5rem;font-size:.95rem;color:#6b7280}.modal-platforms{display:flex;flex-direction:column;gap:.75rem;margin-bottom:1.5rem}.modal-platform-option{display:flex;align-items:center;gap:1rem;padding:1rem;background-color:#f3f4f6;border:2px solid transparent;border-radius:.5rem;cursor:pointer;transition:all .2s ease;text-align:left}.modal-platform-option:hover{background-color:#e5e7eb;border-color:#1e7ec4}.modal-platform-icon{font-size:2rem;display:flex;align-items:center;justify-content:center;width:2.5rem;height:2.5rem;flex-shrink:0}.modal-platform-info{flex:1}.modal-platform-name{font-weight:600;color:#1f2937;margin-bottom:.25rem}.modal-platform-stats{font-size:.875rem;color:#6b7280}.modal-cancel-button{width:100%;padding:.75rem;background-color:#e5e7eb;color:#374151;border:none;border-radius:.375rem;font-weight:600;cursor:pointer;transition:background-color .2s ease}.modal-cancel-button:hover{background-color:#d1d5db}@media(max-width:768px){.header{flex-direction:column;padding:1rem;gap:1rem}.header-search{max-width:none}.platform-card{flex-wrap:wrap}.platform-header{flex:1 1 100%}.platform-stats{flex:1 1 100%;gap:1rem}.card-actions{flex:0 0 auto;align-self:flex-start}.main-content{padding:1rem}.modal-content{width:95%;max-height:90vh;padding:1.5rem}}.app-container{display:flex;flex-direction:column;min-height:100vh;background-color:#f5f5f5}