*{margin:0;padding:0;box-sizing:border-box}:root{font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Fira Sans,Droid Sans,Helvetica Neue,sans-serif;line-height:1.5;font-weight:400;font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}body{margin:0;min-width:320px;min-height:100vh;background:#f3f4f6}#root{width:100%;min-height:100vh}h1,h2,h3,h4,h5,h6{font-weight:600;line-height:1.2}button,input{font-family:inherit}a{text-decoration:none;color:inherit}*{scrollbar-width:thin;scrollbar-color:#cbd5e1 #f1f5f9}*::-webkit-scrollbar{width:8px;height:8px}*::-webkit-scrollbar-track{background:#f1f5f9}*::-webkit-scrollbar-thumb{background:#cbd5e1;border-radius:4px}*::-webkit-scrollbar-thumb:hover{background:#94a3b8}.status-card{background:#fff;border-radius:12px;padding:24px;box-shadow:0 2px 8px #0000001a;display:flex;align-items:center;gap:20px;transition:transform .2s,box-shadow .2s}.status-card:hover{transform:translateY(-2px);box-shadow:0 4px 12px #00000026}.status-card-icon{display:flex;align-items:center;justify-content:center;width:64px;height:64px;border-radius:12px;background:linear-gradient(135deg,#667eea,#764ba2);color:#fff}.status-card-blue .status-card-icon{background:linear-gradient(135deg,#667eea,#764ba2)}.status-card-green .status-card-icon{background:linear-gradient(135deg,#84fab0,#8fd3f4)}.status-card-orange .status-card-icon{background:linear-gradient(135deg,#fa709a,#fee140)}.status-card-purple .status-card-icon{background:linear-gradient(135deg,#a8edea,#fed6e3)}.status-card-content{flex:1}.status-card-title{margin:0;font-size:14px;font-weight:500;color:#6b7280;text-transform:uppercase;letter-spacing:.5px}.status-card-value{font-size:32px;font-weight:700;color:#111827;margin-top:4px}.status-card-subtitle{margin:4px 0 0;font-size:12px;color:#9ca3af}.ticket-monitor{background:#fff;border-radius:12px;padding:24px;box-shadow:0 2px 8px #0000001a}.ticket-monitor-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:24px}.ticket-monitor-header h2{margin:0;font-size:20px;font-weight:600;color:#111827}.ticket-count{background:#eff6ff;color:#2563eb;padding:4px 12px;border-radius:20px;font-size:14px;font-weight:500}.empty-state{text-align:center;padding:60px 20px;color:#6b7280}.empty-icon{color:#d1d5db;margin-bottom:16px}.empty-state p{margin:0;font-size:16px;font-weight:500;color:#374151}.empty-subtitle{display:block;margin-top:8px;font-size:14px;color:#9ca3af}.ticket-table-container{overflow-x:auto}.ticket-table{width:100%;border-collapse:collapse}.ticket-table thead{background:#f9fafb;border-bottom:2px solid #e5e7eb}.ticket-table th{padding:12px 16px;text-align:left;font-size:12px;font-weight:600;color:#6b7280;text-transform:uppercase;letter-spacing:.5px}.ticket-table tbody tr{border-bottom:1px solid #f3f4f6;transition:background-color .2s}.ticket-table tbody tr:hover{background-color:#f9fafb}.ticket-table td{padding:16px;font-size:14px;color:#374151}.ticket-id{font-weight:500}.id-badge{display:inline-block;background:#eff6ff;color:#2563eb;padding:4px 12px;border-radius:6px;font-family:Courier New,monospace;font-size:13px;font-weight:600}.subject-content{display:flex;align-items:center;gap:8px}.subject-icon{color:#9ca3af;flex-shrink:0}.time-content{display:flex;align-items:center;gap:6px;color:#6b7280;font-size:13px}.time-content svg{color:#9ca3af}.status-badge{display:inline-flex;align-items:center;gap:6px;padding:6px 12px;border-radius:20px;font-size:12px;font-weight:500}.status-processing{background:#fef3c7;color:#92400e}.status-dot{width:6px;height:6px;border-radius:50%;background:currentColor;animation:pulse 2s infinite}@keyframes pulse{0%,to{opacity:1}50%{opacity:.5}}.manual-process{background:#fff;border-radius:12px;padding:24px;box-shadow:0 2px 8px #0000001a}.manual-process-header{margin-bottom:24px}.manual-process-header h2{margin:0 0 8px;font-size:20px;font-weight:600;color:#111827}.manual-process-header p{margin:0;font-size:14px;color:#6b7280}.process-form{max-width:100%}.form-group{margin-bottom:16px}.form-group label{display:block;margin-bottom:8px;font-size:14px;font-weight:500;color:#374151}.input-group{display:flex;gap:12px}.form-input{flex:1;padding:12px 16px;font-size:14px;border:2px solid #e5e7eb;border-radius:8px;transition:border-color .2s}.form-input:focus{outline:none;border-color:#667eea}.form-input:disabled{background:#f9fafb;cursor:not-allowed}.submit-button{display:flex;align-items:center;gap:8px;padding:12px 24px;font-size:14px;font-weight:500;color:#fff;background:linear-gradient(135deg,#667eea,#764ba2);border:none;border-radius:8px;cursor:pointer;transition:transform .2s,box-shadow .2s;white-space:nowrap}.submit-button:hover:not(:disabled){transform:translateY(-1px);box-shadow:0 4px 12px #667eea66}.submit-button:disabled{opacity:.6;cursor:not-allowed;transform:none}.message{padding:12px 16px;border-radius:8px;font-size:14px;margin-top:16px}.message-success{background:#d1fae5;color:#065f46;border:1px solid #6ee7b7}.message-error{background:#fee2e2;color:#991b1b;border:1px solid #fca5a5}.processed-card{background:#fff;border-radius:12px;padding:24px;box-shadow:0 2px 8px #0000001a}.processed-header{display:flex;justify-content:space-between;align-items:flex-start;margin-bottom:16px}.processed-header h2{margin:0;font-size:20px;font-weight:700;color:#111827}.processed-subtitle{margin:4px 0 0;color:#6b7280;font-size:13px}.processed-count{background:#eef2ff;color:#4f46e5;padding:6px 12px;border-radius:20px;font-size:13px;font-weight:600}.processed-empty{text-align:center;padding:40px 12px;color:#6b7280}.processed-empty-icon{color:#d1d5db;margin-bottom:12px}.processed-empty p{margin:0;font-size:16px;font-weight:600;color:#374151}.processed-list{display:flex;flex-direction:column;gap:12px}.processed-row{border:1px solid #e5e7eb;border-radius:10px;padding:14px 16px;background:#f9fafb;transition:all .2s ease}.processed-row:hover{background:#f3f4f6;border-color:#d1d5db}.processed-main{display:flex;align-items:center;gap:12px;margin-bottom:10px}.processed-main.clickable{cursor:pointer;-webkit-user-select:none;user-select:none}.processed-main.clickable:hover .processed-title{color:#4f46e5}.processed-id{background:#eef2ff;color:#4f46e5;padding:6px 10px;border-radius:8px;font-weight:700;font-family:Courier New,monospace;font-size:13px}.processed-title{font-weight:600;color:#111827}.processed-meta{display:flex;flex-wrap:wrap;gap:10px;align-items:center}.meta-item{display:inline-flex;align-items:center;gap:6px;padding:6px 10px;background:#fff;border-radius:8px;color:#4b5563;font-size:13px;border:1px solid #e5e7eb}.status-chip{display:inline-flex;align-items:center;gap:6px;padding:6px 12px;border-radius:999px;font-weight:600;font-size:12px}.status-success{background:#ecfdf3;color:#166534;border:1px solid #bbf7d0}.status-error{background:#fef2f2;color:#b91c1c;border:1px solid #fecaca}.status-nonactionable{background:#fff7ed;color:#b45309;border:1px solid #fed7aa}.status-neutral{background:#eef2ff;color:#4338ca;border:1px solid #c7d2fe}.processed-error{margin-top:8px;color:#b91c1c;font-size:13px}.processed-reason{margin-top:6px;color:#4b5563;font-size:13px}.ticket-details{margin-top:16px;padding-top:16px;border-top:2px solid #e5e7eb}.detail-section{margin-bottom:16px}.detail-section:last-child{margin-bottom:0}.detail-section h3{font-size:14px;font-weight:700;color:#374151;margin:0 0 10px;padding-bottom:6px;border-bottom:1px solid #e5e7eb}.detail-content{background:#fff;border-radius:8px;padding:12px;border:1px solid #e5e7eb}.detail-row{margin-bottom:8px;font-size:13px;color:#4b5563}.detail-row:last-child{margin-bottom:0}.detail-row strong{color:#1f2937;margin-right:8px}.detail-row.description{display:flex;flex-direction:column;gap:6px}.description-text{background:#f9fafb;padding:10px;border-radius:6px;border:1px solid #e5e7eb;white-space:pre-wrap;font-family:system-ui,-apple-system,sans-serif;line-height:1.5}.reply-text{background:#f0fdf4;padding:12px;border-radius:6px;border:1px solid #bbf7d0;white-space:pre-wrap;font-size:13px;line-height:1.6;color:#166534}.json-data{background:#f9fafb;padding:10px;border-radius:6px;border:1px solid #e5e7eb;overflow-x:auto;font-family:Courier New,monospace;font-size:12px;margin:8px 0 0;color:#374151;max-height:300px;overflow-y:auto}.no-data{color:#9ca3af;font-style:italic;font-size:13px;margin:0}.dashboard{min-height:100vh;background:linear-gradient(135deg,#667eea,#764ba2);padding:24px}.dashboard-loading{display:flex;flex-direction:column;align-items:center;justify-content:center;min-height:100vh;color:#fff;gap:16px}.dashboard-loading p{font-size:18px;font-weight:500}.dashboard-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:24px;flex-wrap:wrap;gap:16px}.header-content h1{margin:0;font-size:32px;font-weight:700;color:#fff}.header-subtitle{margin:4px 0 0;font-size:16px;color:#ffffffe6}.header-actions{display:flex;gap:12px}.refresh-button,.refresh-toggle{display:flex;align-items:center;gap:8px;padding:10px 16px;background:#fff3;border:2px solid rgba(255,255,255,.3);border-radius:8px;color:#fff;font-size:14px;font-weight:500;cursor:pointer;transition:all .2s;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}.refresh-button:hover:not(:disabled),.refresh-toggle:hover{background:#ffffff4d;border-color:#ffffff80}.refresh-toggle.active{background:#86efac4d;border-color:#86efac80}.refresh-button:disabled{opacity:.5;cursor:not-allowed}.error-banner{display:flex;align-items:center;gap:12px;padding:16px;background:#fee2e2;border:2px solid #fca5a5;border-radius:8px;color:#991b1b;margin-bottom:16px;font-weight:500}.last-update{text-align:right;color:#fffc;font-size:12px;margin-bottom:16px}.metrics-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:20px;margin-bottom:24px}.dashboard-grid{display:grid;grid-template-columns:1fr 400px;gap:24px;align-items:start}.dashboard-secondary{margin-top:20px}@media(max-width:1200px){.dashboard-grid{grid-template-columns:1fr}}@media(max-width:768px){.dashboard{padding:16px}.header-content h1{font-size:24px}.header-subtitle{font-size:14px}.metrics-grid{grid-template-columns:1fr}}.spin{animation:spin 1s linear infinite}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.dashboard-main{min-height:400px}.App{width:100%;min-height:100vh}