:root{--color-bg:#0a0e1a;--color-bg-sidebar:#0d1117;--color-bg-card:#161b22;--color-bg-input:#1c2333;--color-border:#ffffff14;--color-border-hover:#ffffff26;--color-text:#e6edf3;--color-text-secondary:#8b949e;--color-text-muted:#484f58;--color-primary:#2563eb;--color-primary-light:#3b82f6;--color-secondary:#7c3aed;--color-accent:#06b6d4;--color-success:#10b981;--color-warning:#f59e0b;--color-error:#ef4444;--gradient-hero:linear-gradient(135deg, #2563eb, #7c3aed, #06b6d4);--font-sans:"Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;--font-mono:"JetBrains Mono", monospace;--radius-sm:6px;--radius-md:8px;--radius-lg:12px;--sidebar-width:260px;--header-height:60px}*,:before,:after{box-sizing:border-box;margin:0;padding:0}html{font-size:14px}body{font-family:var(--font-sans);background:var(--color-bg);color:var(--color-text);-webkit-font-smoothing:antialiased;line-height:1.6}a{color:inherit;text-decoration:none}button{cursor:pointer;font:inherit;color:inherit;background:0 0;border:none}input,textarea,select{font:inherit;color:inherit}ul,ol{list-style:none}.app-layout{min-height:100vh;display:flex}.sidebar{width:var(--sidebar-width);background:var(--color-bg-sidebar);border-right:1px solid var(--color-border);z-index:100;flex-direction:column;transition:transform .3s;display:flex;position:fixed;top:0;bottom:0;left:0}.sidebar-brand{border-bottom:1px solid var(--color-border);align-items:center;gap:.75rem;padding:1.25rem 1.5rem;display:flex}.sidebar-brand svg{flex-shrink:0}.sidebar-brand-text{flex-direction:column;display:flex}.sidebar-brand-name{letter-spacing:-.02em;font-size:1rem;font-weight:700}.sidebar-brand-label{color:var(--color-text-muted);text-transform:uppercase;letter-spacing:.1em;font-size:.7rem}.sidebar-nav{flex:1;padding:1rem .75rem;overflow-y:auto}.sidebar-section-label{text-transform:uppercase;letter-spacing:.1em;color:var(--color-text-muted);padding:.75rem .75rem .5rem;font-size:.7rem;font-weight:600}.sidebar-link{border-radius:var(--radius-sm);color:var(--color-text-secondary);align-items:center;gap:.75rem;margin-bottom:2px;padding:.6rem .75rem;font-size:.9rem;font-weight:500;transition:all .2s;display:flex}.sidebar-link:hover{color:var(--color-text);background:#ffffff0d}.sidebar-link.active{color:var(--color-primary-light);background:#2563eb1f}.sidebar-link .icon{text-align:center;flex-shrink:0;width:20px}.sidebar-link .badge{background:var(--color-error);color:#fff;text-align:center;border-radius:10px;min-width:18px;margin-left:auto;padding:.1rem .45rem;font-size:.7rem;font-weight:700}.main-content{margin-left:var(--sidebar-width);flex:1;min-height:100vh}.main-header{height:var(--header-height);border-bottom:1px solid var(--color-border);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);z-index:50;background:#0a0e1acc;justify-content:space-between;align-items:center;padding:0 2rem;display:flex;position:sticky;top:0}.main-header h1{letter-spacing:-.02em;font-size:1.2rem;font-weight:700}.header-actions{align-items:center;gap:1rem;display:flex}.main-body{padding:2rem}.stat-grid{grid-template-columns:repeat(4,1fr);gap:1rem;margin-bottom:2rem;display:grid}.stat-card{background:var(--color-bg-card);border:1px solid var(--color-border);border-radius:var(--radius-lg);padding:1.25rem 1.5rem;transition:all .25s}.stat-card:hover{border-color:var(--color-border-hover);transform:translateY(-2px)}.stat-card-label{color:var(--color-text-muted);align-items:center;gap:.5rem;margin-bottom:.5rem;font-size:.8rem;font-weight:500;display:flex}.stat-card-value{letter-spacing:-.03em;font-size:2rem;font-weight:800;line-height:1}.stat-card-change{margin-top:.5rem;font-size:.8rem;font-weight:500}.stat-card-change.positive{color:var(--color-success)}.stat-card-change.negative{color:var(--color-error)}.data-table-wrapper{background:var(--color-bg-card);border:1px solid var(--color-border);border-radius:var(--radius-lg);overflow:hidden}.data-table-header{border-bottom:1px solid var(--color-border);justify-content:space-between;align-items:center;padding:1rem 1.5rem;display:flex}.data-table-title{font-size:1rem;font-weight:700}.data-table{border-collapse:collapse;width:100%}.data-table th{text-align:left;text-transform:uppercase;letter-spacing:.05em;color:var(--color-text-muted);border-bottom:1px solid var(--color-border);background:#ffffff05;padding:.75rem 1.5rem;font-size:.75rem;font-weight:600}.data-table td{border-bottom:1px solid var(--color-border);padding:.85rem 1.5rem;font-size:.9rem}.data-table tr:last-child td{border-bottom:none}.data-table tr:hover td{background:#ffffff05}.status-badge{border-radius:20px;align-items:center;gap:.3rem;padding:.2rem .6rem;font-size:.75rem;font-weight:600;display:inline-flex}.status-badge.new{color:#60a5fa;background:#2563eb26}.status-badge.read{color:#fbbf24;background:#f59e0b26}.status-badge.replied{color:#34d399;background:#10b98126}.status-badge.archived{color:#94a3b8;background:#64748b26}.status-badge.pending{color:#fbbf24;background:#f59e0b26}.status-badge.active{color:#34d399;background:#10b98126}.status-badge.inquiry{color:#60a5fa;background:#2563eb26}.btn{border-radius:var(--radius-sm);justify-content:center;align-items:center;gap:.5rem;padding:.55rem 1.15rem;font-size:.85rem;font-weight:600;transition:all .2s;display:inline-flex}.btn-primary{background:var(--color-primary);color:#fff}.btn-primary:hover{background:var(--color-primary-light);transform:translateY(-1px)}.btn-ghost{color:var(--color-text-secondary);border:1px solid var(--color-border)}.btn-ghost:hover{color:var(--color-text);background:#ffffff0d}.btn-sm{padding:.35rem .75rem;font-size:.8rem}.form-group{margin-bottom:1rem}.form-label{color:var(--color-text-secondary);margin-bottom:.35rem;font-size:.8rem;font-weight:600;display:block}.form-input{background:var(--color-bg-input);border:1px solid var(--color-border);border-radius:var(--radius-sm);outline:none;width:100%;padding:.6rem .85rem;transition:all .2s}.form-input:focus{border-color:var(--color-primary);box-shadow:0 0 0 3px #2563eb1a}.login-page{background:var(--color-bg);justify-content:center;align-items:center;min-height:100vh;display:flex;position:relative}.login-card{background:var(--color-bg-card);border:1px solid var(--color-border);border-radius:var(--radius-lg);width:100%;max-width:400px;padding:2.5rem}.login-logo{text-align:center;margin-bottom:2rem}.login-logo h2{background:var(--gradient-hero);-webkit-text-fill-color:transparent;-webkit-background-clip:text;background-clip:text;margin-top:.75rem;font-size:1.3rem;font-weight:800}.login-logo p{color:var(--color-text-muted);font-size:.85rem}.login-btn{background:var(--gradient-hero);color:#fff;border-radius:var(--radius-sm);width:100%;margin-top:.5rem;padding:.75rem;font-size:.95rem;font-weight:700;transition:all .25s}.login-btn:hover{transform:translateY(-2px);box-shadow:0 4px 20px #2563eb66}.login-error{color:var(--color-error);border-radius:var(--radius-sm);text-align:center;background:#ef44441a;margin-bottom:1rem;padding:.6rem 1rem;font-size:.85rem}.empty-state{text-align:center;color:var(--color-text-muted);padding:4rem 2rem}.empty-state .icon{margin-bottom:1rem;font-size:3rem}.empty-state h3{color:var(--color-text-secondary);margin-bottom:.5rem;font-size:1.1rem}@media (width<=1024px){.stat-grid{grid-template-columns:repeat(2,1fr)}}@media (width<=768px){.sidebar{transform:translate(-100%)}.sidebar.open{transform:translate(0)}.main-content{margin-left:0}.stat-grid{grid-template-columns:1fr}}::-webkit-scrollbar{width:6px}::-webkit-scrollbar-track{background:var(--color-bg)}::-webkit-scrollbar-thumb{background:var(--color-bg-card);border-radius:3px}.chart-card{background:var(--color-bg-card);border:1px solid var(--color-border);border-radius:var(--radius-lg);margin-bottom:1.5rem;padding:1.5rem}.chart-card-title{margin-bottom:1rem;font-size:.95rem;font-weight:700}.detail-panel{background:var(--color-bg-card);border:1px solid var(--color-border);border-radius:var(--radius-lg);padding:1.5rem}.detail-row{border-bottom:1px solid var(--color-border);justify-content:space-between;padding:.6rem 0;display:flex}.detail-row:last-child{border-bottom:none}.detail-label{color:var(--color-text-muted);font-size:.85rem;font-weight:500}.detail-value{font-size:.9rem;font-weight:500}
