:root{--color-gold:#c59b4c;--color-gold-hover:#b08738;--color-gold-dark:#8f6926;--color-gold-light:#c59b4c1a;--color-gold-glow:#c59b4c38;--color-gold-border:#c59b4c59;--color-dark:#0a0b0e;--color-dark-surface:#11141c;--color-dark-border:#1e2330;--bg-page:#fff;--bg-card:#fff;--bg-subtle:#f8fafc;--bg-hover:#f1f5f9;--bg-active:#e2e8f0;--border-light:#e2e8f0;--border-subtle:#edf2f7;--border-focus:#c59b4c;--text-primary:#0f172a;--text-secondary:#475569;--text-muted:#64748b;--text-light:#94a3b8;--color-success:#10b981;--color-success-bg:#ecfdf5;--color-warning:#f59e0b;--color-warning-bg:#fffbeb;--color-danger:#ef4444;--color-danger-bg:#fef2f2;--color-info:#0284c7;--color-info-bg:#f0f9ff;--shadow-sm:0 1px 2px #0000000d;--shadow-md:0 4px 6px -1px #00000012, 0 2px 4px -2px #0000000a;--shadow-lg:0 10px 15px -3px #0f172a14, 0 4px 6px -4px #0f172a0a;--shadow-xl:0 20px 25px -5px #0f172a1a, 0 8px 10px -6px #0f172a0a;--shadow-gold:0 4px 20px #c59b4c40;--font-sans:"Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;--font-display:"Outfit", "Inter", sans-serif;--radius-sm:6px;--radius-md:10px;--radius-lg:14px;--radius-xl:20px;--radius-full:9999px;--transition-fast:.15s ease;--transition-normal:.25s ease}*{box-sizing:border-box;margin:0;padding:0}html,body{background-color:var(--bg-page);height:100%;color:var(--text-primary);font-family:var(--font-sans);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}#root{background-color:var(--bg-page);flex-direction:column;min-height:100vh;display:flex}h1,h2,h3,h4,h5,h6{font-family:var(--font-display);color:var(--text-primary);letter-spacing:-.02em}.btn{font-family:var(--font-sans);border-radius:var(--radius-md);cursor:pointer;transition:all var(--transition-fast);border:1px solid #0000;justify-content:center;align-items:center;gap:8px;padding:9px 18px;font-size:.88rem;font-weight:600;line-height:1.4;text-decoration:none;display:inline-flex}.btn:disabled{opacity:.6;cursor:not-allowed}.btn-primary{background-color:var(--color-gold);color:#fff;border-color:var(--color-gold);box-shadow:0 2px 8px #c59b4c40}.btn-primary:hover:not(:disabled){background-color:var(--color-gold-hover);border-color:var(--color-gold-hover);box-shadow:var(--shadow-gold);transform:translateY(-1px)}.btn-dark{background-color:var(--color-dark);color:#fff;border-color:var(--color-dark)}.btn-dark:hover:not(:disabled){background-color:#1e2330;transform:translateY(-1px)}.btn-outline{color:var(--text-primary);border-color:var(--border-light);background-color:#fff}.btn-outline:hover:not(:disabled){background-color:var(--bg-hover);border-color:#cbd5e1}.btn-ghost{color:var(--text-secondary);background-color:#0000}.btn-ghost:hover:not(:disabled){background-color:var(--bg-hover);color:var(--text-primary)}.btn-sm{border-radius:var(--radius-sm);padding:6px 12px;font-size:.8rem}.btn-icon{border-radius:var(--radius-md);padding:8px}.badge{border-radius:var(--radius-full);letter-spacing:.02em;align-items:center;gap:5px;padding:3px 8px;font-size:.74rem;font-weight:600;display:inline-flex}.badge-gold{background-color:var(--color-gold-light);color:var(--color-gold-dark);border:1px solid var(--color-gold-border)}.badge-success{background-color:var(--color-success-bg);color:#065f46;border:1px solid #a7f3d0}.badge-warning{background-color:var(--color-warning-bg);color:#92400e;border:1px solid #fde68a}.badge-neutral{background-color:var(--bg-hover);color:var(--text-secondary);border:1px solid var(--border-light)}.input-group{flex-direction:column;gap:6px;margin-bottom:16px;display:flex}.input-label{color:var(--text-primary);font-size:.84rem;font-weight:600}.input-wrapper{align-items:center;display:flex;position:relative}.input-icon{color:var(--text-muted);pointer-events:none;position:absolute;left:14px}.form-input{width:100%;font-size:.9rem;font-family:var(--font-sans);color:var(--text-primary);border:1px solid var(--border-light);border-radius:var(--radius-md);transition:all var(--transition-fast);background-color:#fff;outline:none;padding:10px 14px}.form-input.has-icon{padding-left:42px}.form-input:focus{border-color:var(--color-gold);box-shadow:0 0 0 3px var(--color-gold-light)}.form-input::placeholder{color:var(--text-light)}.login-container{background-color:#fff;width:100%;min-height:100vh;display:flex}.login-visual-col{color:#fff;background-color:#07090e;flex-direction:column;flex:1.15;justify-content:space-between;padding:44px 50px;display:flex;position:relative;overflow:hidden}.login-visual-bg{object-fit:cover;object-position:center;opacity:.55;filter:contrast(1.1)brightness(.95);width:100%;height:100%;transition:transform 10s;position:absolute;inset:0}.login-visual-col:hover .login-visual-bg{transform:scale(1.03)}.login-visual-overlay{z-index:1;background:linear-gradient(135deg,#0a0b0eeb 0%,#0a0b0eb3 45%,#0f172ae0 100%);position:absolute;inset:0}.login-visual-grid{z-index:1;pointer-events:none;background-image:radial-gradient(#c59b4c26 1px,#0000 1px);background-size:28px 28px;position:absolute;inset:0}.login-visual-header{z-index:2;justify-content:space-between;align-items:center;display:flex;position:relative}.brand-badge{-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);border-radius:var(--radius-full);background:#ffffff0f;border:1px solid #ffffff1f;align-items:center;gap:10px;padding:6px 14px;display:inline-flex}.brand-dot{background-color:var(--color-gold);width:8px;height:8px;box-shadow:0 0 10px var(--color-gold);border-radius:50%}.brand-badge-text{letter-spacing:.08em;text-transform:uppercase;color:#e2e8f0;font-size:.76rem;font-weight:700}.login-visual-content{z-index:2;max-width:580px;margin:40px 0;position:relative}.login-visual-title{color:#fff;margin-bottom:18px;font-size:2.6rem;font-weight:800;line-height:1.18}.login-visual-title span{color:var(--color-gold);position:relative}.login-visual-desc{color:#cbd5e1;margin-bottom:28px;font-size:1.05rem;line-height:1.6}.login-sync-pills{flex-wrap:wrap;gap:10px;margin-bottom:32px;display:flex}.sync-pill{-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);border-radius:var(--radius-md);color:#f8fafc;transition:all var(--transition-fast);background:#ffffff12;border:1px solid #ffffff1f;align-items:center;gap:8px;padding:8px 14px;font-size:.82rem;font-weight:600;display:inline-flex}.sync-pill:hover{border-color:var(--color-gold-border);background:#c59b4c29;transform:translateY(-2px)}.sync-pill-icon{color:var(--color-gold)}.login-visual-footer{z-index:2;border-top:1px solid #ffffff1f;grid-template-columns:repeat(3,1fr);gap:16px;padding-top:24px;display:grid;position:relative}.stat-item{flex-direction:column;display:flex}.stat-num{font-family:var(--font-display);color:#fff;font-size:1.4rem;font-weight:800}.stat-num span{color:var(--color-gold)}.stat-label{color:#94a3b8;margin-top:2px;font-size:.74rem;font-weight:500}.login-form-col{background-color:#fff;flex-direction:column;flex:1;justify-content:center;align-items:center;padding:48px;display:flex;position:relative}.login-form-box{width:100%;max-width:440px}.login-header{margin-bottom:32px}.cinndev-logo-lockup{align-items:center;gap:10px;margin-bottom:22px;text-decoration:none;display:flex}.cinndev-logo-icon{width:40px;height:40px;color:var(--color-gold);border:1px solid var(--color-gold-border);background:linear-gradient(135deg,#0a0b0e 0%,#1e293b 100%);border-radius:10px;justify-content:center;align-items:center;display:flex;box-shadow:0 4px 10px #00000014}.cinndev-logo-text{font-family:var(--font-display);color:var(--color-dark);letter-spacing:-.02em;font-size:1.55rem;font-weight:800}.cinndev-logo-tag{background:var(--color-gold-light);color:var(--color-gold-dark);border:1px solid var(--color-gold-border);text-transform:uppercase;border-radius:4px;margin-left:4px;padding:2px 6px;font-size:.65rem;font-weight:700}.login-title{color:var(--text-primary);margin-bottom:6px;font-size:1.85rem;font-weight:800}.login-subtitle{color:var(--text-muted);font-size:.92rem}.sso-grid{grid-template-columns:1fr 1fr;gap:12px;margin-bottom:24px;display:grid}.sso-btn{border:1px solid var(--border-light);border-radius:var(--radius-md);color:var(--text-primary);cursor:pointer;transition:all var(--transition-fast);background-color:#fff;justify-content:center;align-items:center;gap:9px;padding:10px 14px;font-size:.84rem;font-weight:600;display:flex}.sso-btn:hover{background-color:var(--bg-hover);border-color:#cbd5e1}.divider{color:var(--text-light);text-transform:uppercase;letter-spacing:.06em;align-items:center;margin:24px 0;font-size:.78rem;font-weight:600;display:flex}.divider:before,.divider:after{content:"";background-color:var(--border-light);flex:1;height:1px}.divider span{padding:0 12px}.demo-pill-btn{background-color:var(--color-gold-light);border:1px dashed var(--color-gold-border);border-radius:var(--radius-md);width:100%;color:var(--color-gold-dark);cursor:pointer;transition:all var(--transition-fast);justify-content:center;align-items:center;gap:6px;margin-top:14px;padding:8px 14px;font-size:.8rem;font-weight:600;display:inline-flex}.demo-pill-btn:hover{border-color:var(--color-gold);background-color:#c59b4c2e}.login-form-footer{text-align:center;color:var(--text-muted);margin-top:28px;font-size:.78rem}.login-form-footer a{color:var(--color-gold-dark);font-weight:600;text-decoration:none}.login-security-tag{color:var(--text-muted);background:var(--bg-subtle);border-radius:var(--radius-full);border:1px solid var(--border-light);align-items:center;gap:6px;margin-top:18px;padding:6px 12px;font-size:.74rem;display:inline-flex}.dashboard-layout{background-color:#fff;min-height:100vh;display:flex}.dashboard-sidebar{border-right:1px solid var(--border-light);z-index:20;background-color:#fff;flex-direction:column;flex-shrink:0;width:270px;height:100vh;display:flex;position:sticky;top:0}.sidebar-header{border-bottom:1px solid var(--border-subtle);justify-content:space-between;align-items:center;padding:22px 20px;display:flex}.sidebar-nav{flex-direction:column;flex:1;gap:4px;padding:16px 12px;display:flex;overflow-y:auto}.nav-section-title{color:var(--text-light);text-transform:uppercase;letter-spacing:.08em;padding:10px 12px 6px;font-size:.68rem;font-weight:700}.nav-item{border-radius:var(--radius-md);color:var(--text-secondary);cursor:pointer;text-align:left;width:100%;transition:all var(--transition-fast);background:0 0;border:none;justify-content:space-between;align-items:center;padding:10px 14px;font-size:.88rem;font-weight:600;display:flex}.nav-item-left{align-items:center;gap:12px;display:flex}.nav-item:hover{background-color:var(--bg-hover);color:var(--text-primary)}.nav-item.active{background-color:var(--color-gold-light);color:var(--color-gold-dark);border:1px solid var(--color-gold-border);font-weight:700}.nav-item.active .nav-icon{color:var(--color-gold)}.sidebar-footer{border-top:1px solid var(--border-light);background-color:#fafafa;padding:16px 14px}.user-profile-badge{border-radius:var(--radius-md);cursor:pointer;transition:background var(--transition-fast);align-items:center;gap:12px;padding:8px;display:flex}.user-profile-badge:hover{background-color:var(--bg-hover)}.user-avatar{object-fit:cover;border:2px solid var(--color-gold-border);border-radius:50%;width:38px;height:38px}.user-info{flex:1;min-width:0}.user-name{color:var(--text-primary);white-space:nowrap;text-overflow:ellipsis;font-size:.86rem;font-weight:700;overflow:hidden}.user-role{color:var(--text-muted);white-space:nowrap;text-overflow:ellipsis;font-size:.72rem;overflow:hidden}.dashboard-main{background-color:#fff;flex-direction:column;flex:1;min-width:0;display:flex}.dashboard-topbar{border-bottom:1px solid var(--border-light);z-index:10;background-color:#fff;justify-content:space-between;align-items:center;height:70px;padding:0 32px;display:flex;position:sticky;top:0}.topbar-left{flex:1;align-items:center;gap:20px;max-width:520px;display:flex}.search-box{width:100%;position:relative}.search-box input{border-radius:var(--radius-full);border:1px solid var(--border-light);background-color:var(--bg-subtle);width:100%;color:var(--text-primary);transition:all var(--transition-fast);outline:none;padding:9px 16px 9px 40px;font-size:.86rem}.search-box input:focus{border-color:var(--color-gold);box-shadow:0 0 0 3px var(--color-gold-light);background-color:#fff}.search-box .search-icon{color:var(--text-muted);position:absolute;top:50%;left:14px;transform:translateY(-50%)}.topbar-right{align-items:center;gap:16px;display:flex}.sync-status-indicator{border-radius:var(--radius-full);background-color:var(--bg-subtle);border:1px solid var(--border-light);color:var(--text-secondary);align-items:center;gap:8px;padding:6px 14px;font-size:.78rem;font-weight:600;display:flex}.sync-pulse{background-color:var(--color-success);width:8px;height:8px;box-shadow:0 0 8px var(--color-success);border-radius:50%;position:relative}.sync-pulse.syncing{background-color:var(--color-gold);box-shadow:0 0 10px var(--color-gold);animation:1.4s infinite pulse-ring}@keyframes pulse-ring{0%{opacity:1;transform:scale(.9)}50%{opacity:.6;transform:scale(1.3)}to{opacity:1;transform:scale(.9)}}.dashboard-content-area{background-color:#fff;flex:1;padding:32px;overflow-y:auto}.metrics-grid{grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:20px;margin-bottom:28px;display:grid}.metric-card{border:1px solid var(--border-light);border-radius:var(--radius-lg);box-shadow:var(--shadow-sm);transition:all var(--transition-fast);background-color:#fff;flex-direction:column;gap:12px;padding:20px;display:flex;position:relative;overflow:hidden}.metric-card:hover{box-shadow:var(--shadow-md);border-color:#cbd5e1;transform:translateY(-2px)}.metric-card:before{content:"";height:3px;transition:background var(--transition-fast);background:0 0;position:absolute;top:0;left:0;right:0}.metric-card.gold:before{background:var(--color-gold)}.metric-card.blue:before{background:#0284c7}.metric-card.green:before{background:#10b981}.metric-card.purple:before{background:#8b5cf6}.metric-header{justify-content:space-between;align-items:center;display:flex}.metric-title{color:var(--text-muted);text-transform:uppercase;letter-spacing:.04em;font-size:.82rem;font-weight:600}.metric-icon-wrap{border-radius:var(--radius-md);background-color:var(--bg-subtle);width:38px;height:38px;color:var(--text-primary);border:1px solid var(--border-light);justify-content:center;align-items:center;display:flex}.metric-value{font-family:var(--font-display);color:var(--text-primary);font-size:1.85rem;font-weight:800;line-height:1.1}.metric-footer{color:var(--text-secondary);align-items:center;gap:6px;font-size:.78rem;display:flex}.card-panel{border:1px solid var(--border-light);border-radius:var(--radius-lg);box-shadow:var(--shadow-sm);background-color:#fff;margin-bottom:24px;overflow:hidden}.panel-header{border-bottom:1px solid var(--border-light);background-color:#fff;justify-content:space-between;align-items:center;padding:20px 24px;display:flex}.panel-title{color:var(--text-primary);font-size:1.15rem;font-weight:700}.panel-desc{color:var(--text-muted);margin-top:2px;font-size:.82rem}.panel-body{padding:24px}.email-table{border-collapse:collapse;width:100%}.email-row{border-bottom:1px solid var(--border-subtle);cursor:pointer;transition:background var(--transition-fast);background-color:#fff;grid-template-columns:40px 180px 1fr 120px 40px;align-items:center;padding:14px 20px;display:grid}.email-row:hover{background-color:var(--bg-hover)}.email-row.unread{background-color:#fafcff;font-weight:600}.email-row.unread .email-subject{color:var(--text-primary);font-weight:700}.email-sender{color:var(--text-primary);white-space:nowrap;text-overflow:ellipsis;font-size:.88rem;overflow:hidden}.email-subject-group{align-items:center;gap:8px;display:flex;overflow:hidden}.email-subject{color:var(--text-secondary);white-space:nowrap;text-overflow:ellipsis;font-size:.88rem;overflow:hidden}.email-snippet{color:var(--text-muted);white-space:nowrap;text-overflow:ellipsis;font-size:.84rem;font-weight:400;overflow:hidden}.email-time{color:var(--text-muted);text-align:right;font-size:.78rem}.event-item-card{border:1px solid var(--border-light);border-radius:var(--radius-md);transition:all var(--transition-fast);background-color:#fff;justify-content:space-between;align-items:center;margin-bottom:12px;padding:16px 20px;display:flex}.event-item-card:hover{border-color:var(--color-gold);box-shadow:var(--shadow-sm);transform:translate(3px)}.event-date-badge{border-radius:var(--radius-md);background-color:var(--bg-subtle);border:1px solid var(--border-light);flex-direction:column;flex-shrink:0;justify-content:center;align-items:center;width:58px;height:58px;margin-right:18px;display:flex}.event-date-month{text-transform:uppercase;color:var(--color-gold-dark);font-size:.68rem;font-weight:700}.event-date-day{font-family:var(--font-display);color:var(--text-primary);font-size:1.25rem;font-weight:800}.contacts-grid{grid-template-columns:repeat(auto-fill,minmax(290px,1fr));gap:20px;display:grid}.contact-card{border:1px solid var(--border-light);border-radius:var(--radius-lg);box-shadow:var(--shadow-sm);transition:all var(--transition-fast);background-color:#fff;flex-direction:column;gap:16px;padding:22px;display:flex}.contact-card:hover{border-color:var(--color-gold);box-shadow:var(--shadow-md);transform:translateY(-2px)}.contact-header{align-items:center;gap:14px;display:flex}.contact-avatar{object-fit:cover;border:2px solid var(--color-gold-border);border-radius:50%;width:52px;height:52px}.contact-name{color:var(--text-primary);font-size:1rem;font-weight:700}.contact-title{color:var(--text-muted);font-size:.8rem}.contact-detail-row{color:var(--text-secondary);align-items:center;gap:10px;font-size:.82rem;display:flex}.integrations-grid{grid-template-columns:repeat(auto-fit,minmax(320px,1fr));gap:20px;display:grid}.integration-card{border:1px solid var(--border-light);border-radius:var(--radius-lg);box-shadow:var(--shadow-sm);transition:all var(--transition-fast);background-color:#fff;flex-direction:column;justify-content:space-between;gap:20px;padding:24px;display:flex}.integration-card:hover{box-shadow:var(--shadow-md);border-color:#cbd5e1}.modal-backdrop{-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);z-index:100;background-color:#0a0b0ea6;justify-content:center;align-items:center;padding:20px;animation:.2s fadeIn;display:flex;position:fixed;inset:0}.modal-dialog{border-radius:var(--radius-lg);width:100%;max-width:560px;box-shadow:var(--shadow-xl);border:1px solid var(--border-light);background-color:#fff;animation:.25s slideUp;overflow:hidden}.modal-header{border-bottom:1px solid var(--border-light);justify-content:space-between;align-items:center;padding:20px 24px;display:flex}.modal-title{color:var(--text-primary);font-size:1.2rem;font-weight:700}.modal-body{max-height:70vh;padding:24px;overflow-y:auto}.modal-footer{border-top:1px solid var(--border-light);background-color:var(--bg-subtle);justify-content:flex-end;align-items:center;gap:12px;padding:16px 24px;display:flex}.toast-container{z-index:200;flex-direction:column;gap:10px;max-width:380px;display:flex;position:fixed;bottom:24px;right:24px}.toast{color:#fff;border-radius:var(--radius-md);box-shadow:var(--shadow-lg);border-left:4px solid var(--color-gold);background-color:#0f172a;align-items:center;gap:12px;padding:14px 18px;font-size:.86rem;animation:.25s slideInRight;display:flex}.toast-icon{color:var(--color-gold)}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}@keyframes slideUp{0%{opacity:0;transform:translateY(16px)}to{opacity:1;transform:translateY(0)}}@keyframes slideInRight{0%{opacity:0;transform:translate(40px)}to{opacity:1;transform:translate(0)}}.spinning{animation:1s linear infinite spin}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}@media (width<=1024px){.login-container{flex-direction:column}.login-visual-col{min-height:440px;padding:32px 24px}.login-form-col{padding:36px 20px}.dashboard-sidebar{width:80px}.sidebar-nav .nav-text,.sidebar-header .cinndev-logo-text,.user-info,.nav-section-title{display:none}}@media (width<=640px){.dashboard-topbar{padding:0 16px}.dashboard-content-area{padding:16px}.sso-grid{grid-template-columns:1fr}.email-row{grid-template-columns:32px 120px 1fr 60px}.email-row .email-time{display:none}}