.sidebar{width:260px;height:100vh;position:fixed;top:0;left:0;z-index:200;display:flex;flex-direction:column;background:#ffffffd9;backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);border-right:1px solid var(--border-default);transition:transform var(--transition-slow)}.sidebar-logo{display:flex;align-items:center;justify-content:center;padding:5px 3px;height:100px;border-bottom:1px solid var(--border-default);text-decoration:none}.sidebar-logo-img{height:60px;width:auto}.sidebar-nav{flex:1;padding:16px 12px;display:flex;flex-direction:column;gap:4px;overflow-y:auto}.sidebar-section-label{font-size:.7rem;font-weight:600;color:#000;text-transform:uppercase;letter-spacing:1.2px;padding:12px 12px 6px}.sidebar-link{display:flex;align-items:center;gap:12px;padding:11px 14px;border-radius:var(--radius-md);font-size:.88rem;font-weight:500;color:var(--text-secondary);text-decoration:none;transition:all var(--transition-fast);position:relative}.sidebar-link:hover{color:var(--text-primary);background:#f1686314}.sidebar-link.active{color:#f5f5f5;background:var(--primary-glow);font-weight:600}.sidebar-link.active:before{content:"";position:absolute;left:0;top:6px;bottom:6px;width:3px;border-radius:0 3px 3px 0;background:var(--primary)}.sidebar-link-icon{width:20px;text-align:center;font-size:1.05rem;flex-shrink:0}.sidebar-footer{padding:16px;border-top:1px solid var(--border-default)}.sidebar-user{display:flex;align-items:center;gap:12px;margin-bottom:12px}.sidebar-avatar{width:36px;height:36px;border-radius:50%;background:#000;display:flex;align-items:center;justify-content:center;font-size:.85rem;font-weight:700;color:#fff;flex-shrink:0}.sidebar-user-info{display:flex;flex-direction:column;overflow:hidden}.sidebar-user-name{font-size:.85rem;font-weight:600;color:var(--text-primary);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.sidebar-user-role{font-size:.72rem;color:var(--text-muted);text-transform:capitalize}.sidebar-logout{width:100%;display:flex;align-items:center;justify-content:center;gap:8px;padding:10px;border:1px solid var(--border-default);border-radius:var(--radius-md);background:transparent;color:var(--text-secondary);font-family:var(--font-family);font-size:.82rem;font-weight:500;cursor:pointer;transition:all var(--transition-fast)}.sidebar-logout:hover{border-color:var(--danger);color:var(--danger-light);background:#ef444414}.sidebar-toggle{display:none;position:fixed;top:16px;left:16px;z-index:300;width:40px;height:40px;border-radius:var(--radius-md);border:1px solid var(--border-default);background:#fffffff2;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);color:var(--text-primary);font-size:1.2rem;cursor:pointer;align-items:center;justify-content:center;transition:all var(--transition-fast)}.sidebar-toggle:hover{border-color:var(--primary);background:var(--primary-glow)}.sidebar-overlay{display:none;position:fixed;top:0;right:0;bottom:0;left:0;background:#0003;z-index:150}@media(max-width:768px){.sidebar{transform:translate(-100%)}.sidebar.open{transform:translate(0)}.sidebar-toggle{display:flex}.sidebar-overlay.visible{display:block}}.app-layout{display:flex;min-height:100vh}.app-content{flex:1;margin-left:260px;min-height:100vh;transition:margin-left var(--transition-slow)}@media(max-width:768px){.app-content{margin-left:0;padding-top:56px}}.login-page{min-height:100vh;display:flex;align-items:center;justify-content:center;background:#e3e3e5}.login-container{background:#fff;width:100%;height:400px;max-width:350px;padding:40px;border-radius:20px;box-shadow:0 4px 6px -1px #0000000d,0 2px 4px -1px #00000008;display:flex;flex-direction:column;align-items:center}.login-header{margin:32px;text-align:center}.login-logo{height:50px;width:auto;object-fit:contain}.login-form{width:100%;display:flex;flex-direction:column;gap:16px}.input-row{width:100%}.input-minimal{width:100%;padding:14px 16px;background:#e3e6ea;border:none;border-radius:6px;font-family:var(--font-family);font-size:.95rem;color:var(--text-primary);transition:all .2s ease}.input-minimal::placeholder{color:#555556}.input-minimal:focus{outline:none;background:#f1f5f9;box-shadow:0 0 0 2px #0000009e}.btn-login-custom{margin-top:8px;width:100%;padding:14px;background:#dc2626;color:#fff;border:none;border-radius:3px;font-weight:600;font-size:1rem;cursor:pointer;transition:background-color .2s;font-family:var(--font-family);display:flex;align-items:center;justify-content:center}.btn-login-custom:hover{background:#dc2626}.btn-login-custom:disabled{opacity:.7;cursor:not-allowed}.login-error{border-radius:6px;color:#ef4444;font-size:.85rem;text-align:center}@media(max-width:480px){.login-container{max-width:90%;padding:32px 24px}}.dashboard-stats{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:20px;margin-bottom:40px}.stat-card{padding:24px;display:flex;align-items:center;gap:16px;position:relative;overflow:hidden}.dashboard-actions{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:20px;margin-bottom:40px}.action-card{padding:28px;cursor:pointer;text-decoration:none;color:inherit}.action-card:hover{transform:translateY(-3px);border-color:var(--primary);box-shadow:var(--shadow-glow)}.action-card h3{font-size:1.1rem;margin:12px 0 8px}.action-card p{font-size:.85rem;color:var(--text-secondary)}.recent-section h2{font-size:1.2rem;margin-bottom:16px}.actions-cell{display:flex;align-items:center;gap:8px}@keyframes fadeInUp{0%{opacity:0;transform:translateY(16px)}to{opacity:1;transform:translateY(0)}}.designer-container{display:grid;grid-template-columns:280px 1fr;gap:24px;min-height:calc(100vh - 128px)}.designer-sidebar{width:290px;height:600px;border-radius:var(--radius-lg);display:flex;flex-direction:column;gap:10px;overflow:auto;background-color:#eeeded;padding:10px}.designer-sidebar .card{background:#ffffffb3;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border-color:var(--border-default)}.page-header-template h1{font-size:1.4rem}.page-header-template{display:flex;justify-content:space-between;font-size:1 rem;align-items:center;margin-bottom:24px;background:#fff;border:1px solid var(--border-default);border-radius:var(--radius-lg);padding:15px;transition:all var(--transition-normal);box-shadow:var(--shadow-md)}.header-left{display:flex;flex-direction:column}.field-list{display:flex;flex-direction:column;gap:5px}.field-item{padding:8px 10px;background:#fff;border:1px solid var(--border-default);border-radius:var(--radius-md);display:flex;align-items:center;justify-content:space-between;cursor:pointer;transition:all var(--transition-fast)}.field-item:hover{border-color:var(--bg-elevated);background:var(--bg-elevated)}.field-item.selected{border-color:#6b6b6b;background:var(--bg-elevated)}.field-item span{font-size:.85rem;font-weight:500}.field-controls{display:flex;flex-direction:column;gap:12px;padding:16px;background:var(--bg-elevated);border:1px solid var(--border-default);border-radius:var(--radius-lg)}.field-controls h4{font-size:.78rem;color:var(--text-muted);text-transform:uppercase;letter-spacing:.8px;margin-bottom:2px}.field-controls .input{padding:6px 8px;font-size:.7rem}.field-controls select{padding:8px 10px;background:var(--bg-input);border:1px solid var(--border-default);border-radius:var(--radius-md);color:var(--text-primary);font-family:var(--font-family);font-size:.85rem;outline:none;transition:border-color var(--transition-fast)}.field-controls select:focus{border-color:var(--primary)}.field-controls .control-row{display:flex;gap:8px;align-items:center}.field-controls .control-row label{font-size:.8rem;color:var(--text-secondary);min-width:60px}.designer-canvas{position:relative;background:#eeeded;border:2px dashed var(--border-default);border-radius:var(--radius-lg);overflow:hidden;display:flex;align-items:center;justify-content:center;min-height:500px;box-shadow:inset 0 0 60px #0000000a}.designer-canvas.has-image{border-style:solid;border-color:var(--border-default);background:#ffffffb3;box-shadow:var(--shadow-lg),inset 0 0 0 1px #ffffff08;max-width:100%;max-height:90vh}.canvas-placeholder{text-align:center;color:var(--text-muted)}.canvas-placeholder p{margin-top:8px}.template-image-container{position:relative;display:inline-block}.template-image-container img{display:block;max-width:100%;height:auto}.draggable-field{position:absolute;padding:0;border-radius:4px;cursor:grab;background:#6366f114;-webkit-user-select:none;user-select:none;white-space:nowrap;transition:box-shadow .15s ease,border-color .15s ease;z-index:10}.draggable-field.dragging{cursor:grabbing;border-color:none;z-index:100}.draggable-field:hover,.draggable-field.active{border-color:#000}.upload-area{border:2px dashed var(--border-default);border-radius:var(--radius-lg);padding:10px;text-align:center;cursor:pointer;transition:all var(--transition-fast)}.upload-area:hover{background:#ececec}.modal-overlay{position:fixed;top:0;left:0;width:100%;height:100%;background:#00000080;display:flex;justify-content:center;align-items:center;z-index:1000}.modal-content{display:flex;flex-direction:column;gap:5px}.modal{background:#ececec;padding:24px;border-radius:8px;width:400px;max-width:90%}@media(max-width:768px){.designer-container{grid-template-columns:1fr}}.generator-form{display:grid;grid-template-columns:1fr 1fr;gap:20px;margin-bottom:24px}.generator-form .input-group.full-width{grid-column:1 / -1}.generator-result{margin-top:24px;padding:24px;text-align:center}.generator-result h3{color:var(--success);margin-bottom:12px}.generator-result .cert-details{font-size:.9rem;color:var(--text-secondary);margin-bottom:16px}.generator-result .btn-group{display:flex;gap:12px;justify-content:center}@media(max-width:768px){.generator-form{grid-template-columns:1fr}}.csv-card{margin-bottom:24px}.csv-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:12px}.csv-description{font-size:.85rem;color:var(--text-secondary);margin-bottom:12px}.csv-preview{background:var(--bg-elevated);padding:12px;border-radius:var(--radius-md);font-size:.82rem;color:var(--text-secondary);overflow:auto}.download-sample-btn{font-size:.75rem;padding:6px 12px;transition:.2s ease}.download-sample-btn:hover{transform:translateY(-1px);opacity:.9}.form-container{display:flex;flex-direction:column;gap:20px}.upload-area{border:2px dashed var(--border-default);border-radius:var(--radius-lg);padding:40px;text-align:center;cursor:pointer;transition:.2s ease}.upload-area:hover{border-color:#888787;background:var(--bg-elevated)}.progress-wrapper{margin-top:10px}.progress-header{display:flex;justify-content:space-between;margin-bottom:8px;font-size:.85rem;color:var(--text-secondary)}.progress-percent{font-weight:700;color:var(--primary)}.progress-bar{width:100%;height:8px;background:var(--bg-elevated);border-radius:4px;overflow:hidden}.progress-fill{height:100%;background:var(--primary);transition:width .3s ease}.full-width{width:100%}.result-card{margin-top:24px;text-align:center}.result-message{color:var(--success);margin-bottom:12px}.head-table-container{text-align:center}.result-table-container{margin-top:20px}.verification-code{font-family:monospace;font-size:.8rem;letter-spacing:.5px}.verify-page{min-height:100vh;display:flex;align-items:center;justify-content:center;padding:32px;background:#f6f6f6}.verify-card{max-width:1000px;width:100%;text-align:center}.verify-card-logo-img{display:flex;justify-content:center}.verify-logo-img{justify-content:center;height:100%;max-width:300px;width:100%;margin:20px 5px 20px 35px}.verify-icon{font-size:4rem;margin-bottom:16px}.verify-card h1{font-size:1.5rem;margin-bottom:8px}.verify-card .subtitle{color:var(--text-secondary);margin-bottom:32px}.verify-details{display:flex;flex-direction:column;gap:12px;margin-top:24px}.verify-row{display:flex;justify-content:space-evenly;padding:10px 0;border-bottom:1px solid var(--border-default)}.verify-row:last-child{border-bottom:none}.verify-row .label{color:var(--text-secondary);font-weight:600;font-size:.85rem}.verify-row .value{font-weight:600;font-size:.9rem}.verify-table-container{display:flex;justify-content:center;margin-top:20px}.verify-table{width:100%;max-width:650px;border-collapse:collapse}.verify-table tr{border-bottom:1px solid var(--border-default)}.verify-label{font-weight:600;padding:12px;width:50%;text-align:left}.verify-value{padding:12px;text-align:right}.verify-mono{font-family:monospace;letter-spacing:1px}.admin-tabs{display:flex;gap:4px;margin-bottom:24px;border-bottom:1px solid var(--border-default);padding-bottom:0}.admin-tab{padding:10px 20px;font-size:.875rem;font-weight:500;background:none;border:none;color:var(--text-secondary);cursor:pointer;border-bottom:2px solid transparent;margin-bottom:-1px;transition:all var(--transition-fast);font-family:var(--font-family)}.admin-tab.active{color:var(--primary-light);border-bottom-color:var(--primary)}.admin-tab:hover:not(.active){color:var(--text-primary)}.admin-section{animation:fadeIn .2s ease}@keyframes fadeIn{0%{opacity:0;transform:translateY(4px)}to{opacity:1;transform:translateY(0)}}.create-user-form{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin-bottom:20px}.create-user-form .full-width{grid-column:1 / -1}.admin-actions{display:flex;gap:8px}@media(max-width:768px){.create-user-form{grid-template-columns:1fr}}:root{--primary: #f95853;--primary-light: #f5615c;--primary-dark: #f95853;--primary-glow: #f95853;--accent: #0891b2;--accent-light: #06b6d4;--success: #059669;--success-light: #10b981;--warning: #d97706;--danger: #dc2626;--danger-light: #ef4444;--bg-primary: #f8fafc;--bg-secondary: #f1f5f9;--bg-card: #ffffff;--bg-elevated: #f1f5f9;--bg-input: #ffffff;--text-primary: #0f172a;--text-secondary: #475569;--text-muted: #94a3b8;--text-inverse: #f8fafc;--border-default: rgba(15, 23, 42, .08);--border-hover: rgba(15, 23, 42, .16);--border-focus: var(--primary);--shadow-sm: 0 1px 3px rgba(0, 0, 0, .06), 0 1px 2px rgba(0, 0, 0, .04);--shadow-md: 0 4px 12px rgba(0, 0, 0, .08);--shadow-lg: 0 8px 30px rgba(0, 0, 0, .1);--shadow-glow: 0 0 20px var(--primary-glow);--radius-sm: 6px;--radius-md: 10px;--radius-lg: 16px;--radius-xl: 24px;--font-primary: "Space Grotesk", "Inter", system-ui, sans-serif;--font-decorative: "Parisienne", cursive;--font-script: "Alex Brush", cursive;--font-family:"Space Grotesk", "Inter", system-ui, sans-serif;--transition-fast: .15s ease;--transition-normal: .25s ease;--transition-slow: .4s cubic-bezier(.4, 0, .2, 1)}*,*:before,*:after{margin:0;padding:0;box-sizing:border-box}html{font-size:16px;scroll-behavior:smooth;font-family:Space Grotesk,Inter,-apple-system,BlinkMacSystemFont,Segoe UI}body{font-family:var(--font-family);background:var(--bg-primary);color:var(--text-primary);line-height:1.6;min-height:100vh;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}#root{min-height:100vh;display:flex;flex-direction:column}a{color:var(--primary-light);text-decoration:none;transition:color var(--transition-fast)}a:hover{color:var(--accent-light)}.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;padding:10px 20px;font-family:var(--font-family);font-size:.875rem;font-weight:600;border:none;border-radius:var(--radius-md);cursor:pointer;transition:all var(--transition-normal);white-space:nowrap;position:relative;overflow:hidden}.btn:after{content:"";position:absolute;top:0;right:0;bottom:0;left:0;opacity:0;transition:opacity var(--transition-fast)}.btn:hover:after{opacity:1}.btn:active{transform:scale(.97)}.btn:disabled{opacity:.5;cursor:not-allowed;transform:none}.btn-primary{background:linear-gradient(135deg,var(--primary) 0%,var(--primary-dark) 100%);color:#fff;box-shadow:var(--shadow-sm),0 0 20px var(--primary-glow)}.btn-primary:hover:not(:disabled){box-shadow:var(--shadow-md),0 0 30px #6366f14d;transform:translateY(-1px)}.btn-secondary{background:var(--bg-elevated);color:var(--text-primary);border:1px solid var(--border-default)}.btn-secondary:hover:not(:disabled){border-color:var(--border-hover);background:var(--bg-card)}.btn-create{background:#726767;color:#fff}.btn-green{background-color:#059669;color:#fff}.btn-download{background-color:#4371d3;color:#fff}.btn-danger{background:linear-gradient(135deg,var(--danger) 0%,#dc2626 100%);color:#fff}.btn-danger:hover:not(:disabled){box-shadow:var(--shadow-md),0 0 20px #ef44444d}.btn-enable{background:#059669;color:#fff}.btn-sm{padding:6px 14px;font-size:.8rem}.btn-lg{padding:14px 28px;font-size:1.1rem}.input-group{display:flex;flex-direction:column;gap:6px}.input-group label{font-size:.85rem;font-weight:500;color:var(--text-secondary)}.input{padding:7px;background:var(--bg-input);border:.5px solid var(--border-default);border-radius:var(--radius-md);color:var(--text-primary);font-family:var(--font-family);font-size:.9rem;transition:all var(--transition-fast);outline:none}.input:focus{border-color:#475569}.input::placeholder{color:var(--text-muted)}.card{background:#fff;border:1px solid var(--border-default);border-radius:var(--radius-lg);padding:15px;transition:all var(--transition-normal);box-shadow:var(--shadow-md)}.card:hover{border-color:var(--border-hover)}.badge{display:inline-flex;align-items:center;padding:4px 10px;font-size:.75rem;font-weight:600;border-radius:999px;text-transform:uppercase;letter-spacing:.5px}.badge-success{background:#0596691a;color:var(--success)}.badge-danger{background:#dc26261a;color:var(--danger)}.badge-primary{background:#e92c2c3b;color:#e92c2cfa}.page{flex:1;padding:30px 16px 0;max-width:1200px;margin:0 auto;width:100%}.page-header{margin-bottom:32px;background:#fff;border:1px solid var(--border-default);border-radius:var(--radius-lg);padding:10px;box-shadow:var(--shadow-sm)}.page-header h1{font-size:1.75rem;font-weight:700;color:var(--text-primary);margin-bottom:8px}.page-header p{color:var(--text-secondary);font-size:.95rem}.table-container{overflow-x:auto;border-radius:var(--radius-lg);border:1px solid var(--border-default)}table{width:100%;border-collapse:collapse}th{padding:12px 16px;text-align:left;font-size:.8rem;font-weight:600;color:var(--text-muted);text-transform:uppercase;letter-spacing:.5px;background:var(--bg-elevated);border-bottom:1px solid var(--border-default)}td{padding:14px 16px;font-size:.9rem;color:var(--text-primary);border-bottom:1px solid var(--border-default)}tr:last-child td{border-bottom:none}tr:hover td{background:#6366f10a}.toast{position:fixed;top:24px;right:24px;padding:14px 20px;border-radius:var(--radius-md);font-size:.9rem;font-weight:500;z-index:9999;animation:slideIn .3s ease-out;box-shadow:var(--shadow-lg)}.toast-success{background:var(--success);color:#fff}.toast-error{background:var(--danger);color:#fff}@keyframes slideIn{0%{transform:translate(100%);opacity:0}to{transform:translate(0);opacity:1}}.spinner{width:20px;height:20px;border:2px solid rgba(99,102,241,.25);border-top-color:var(--primary);border-radius:50%;animation:spin .6s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}@media(max-width:768px){.page{padding:16px}.page-header h1{font-size:1.5rem}}