.container{position:relative;z-index:1;width:100%;max-width:480px;padding:20px;margin:0 auto;display:flex;align-items:center;justify-content:center;min-height:100vh;animation:fadeInUp .6s ease-out}@keyframes fadeInUp{0%{opacity:0;transform:translateY(30px)}to{opacity:1;transform:translateY(0)}}.card{background:var(--surface);-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);border-radius:24px;border:1px solid var(--border);box-shadow:0 20px 60px #0000001f;overflow:hidden;transition:all .3s ease;width:100%}.card:hover{box-shadow:0 20px 60px #1a6b7a33}.card-header{text-align:center;padding:40px 32px 24px;background:linear-gradient(180deg,rgba(245,247,250,.98) 0%,transparent 100%)}.logo-container{margin-bottom:16px}.company-logo{max-width:200px;height:auto;display:block;margin:0 auto;filter:drop-shadow(0 2px 8px rgba(0,0,0,.1));transition:transform .3s ease}.company-logo:hover{transform:scale(1.03)}.subtitle{font-size:15px;color:var(--text-secondary);font-weight:400}.card-body{padding:0 32px 32px}.info-box{background:#1a6b7a14;border:1px solid rgba(26,107,122,.15);border-radius:16px;padding:16px;margin-bottom:32px;display:flex;align-items:flex-start;gap:12px;transition:all .3s ease}.info-box:hover{background:#1a6b7a1f;border-color:#1a6b7a40}.info-icon{width:20px;height:20px;color:#1a6b7a;flex-shrink:0;margin-top:2px}.info-box p{font-size:14px;line-height:1.6;color:var(--text-secondary)}.btn-primary{width:100%;padding:18px 24px;background:var(--primary-gradient);border:none;border-radius:16px;color:#fff;font-size:16px;font-weight:600;cursor:pointer;display:flex;align-items:center;justify-content:center;gap:12px;transition:all .3s ease;box-shadow:0 6px 24px #1a6b7a66;position:relative;overflow:hidden;font-family:inherit}.btn-primary:before{content:"";position:absolute;top:0;left:-100%;width:100%;height:100%;background:linear-gradient(90deg,transparent,rgba(255,255,255,.2),transparent);transition:left .5s ease}.btn-primary:hover{transform:translateY(-2px);box-shadow:0 10px 30px #1a6b7a80}.btn-primary:hover:before{left:100%}.btn-primary:active{transform:translateY(0)}.btn-primary:disabled{cursor:not-allowed;opacity:.7}.btn-icon{width:20px;height:20px;transition:transform .3s ease}.btn-primary:hover .btn-icon{transform:translate(4px)}.loader{width:20px;height:20px;border:3px solid rgba(255,255,255,.3);border-top-color:#fff;border-radius:50%;animation:spin .8s linear infinite;display:none}@keyframes spin{to{transform:rotate(360deg)}}.btn-primary.loading .btn-icon,.btn-primary.loading #btn-text{display:none}.btn-primary.loading .loader{display:block}.btn-secondary{padding:12px 24px;background:var(--surface-hover);border:1px solid var(--border);border-radius:12px;color:var(--text-primary);font-size:14px;font-weight:600;cursor:pointer;transition:all .3s ease;font-family:inherit}.btn-secondary:hover{background:var(--border)}.error-message{margin-top:16px;padding:12px 16px;background:#ef444414;border:1px solid rgba(239,68,68,.2);border-radius:12px;color:var(--error);font-size:14px;display:none;align-items:center;gap:10px;animation:shake .3s ease}.error-message.show{display:flex}@keyframes shake{0%,to{transform:translate(0)}25%{transform:translate(-8px)}75%{transform:translate(8px)}}.error-message svg{width:18px;height:18px;flex-shrink:0}.card-footer{padding:24px 32px;border-top:1px solid var(--border);background:#00000005}.hint{display:flex;align-items:center;justify-content:center;gap:8px;font-size:13px;color:var(--text-secondary)}.hint svg{width:16px;height:16px;color:var(--success)}.certificate-modal{position:fixed;top:0;left:0;width:100%;height:100%;z-index:1000;display:flex;align-items:center;justify-content:center;animation:fadeIn .3s ease-out}.modal-backdrop{position:absolute;top:0;left:0;width:100%;height:100%;background:#0006;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px)}.modal-content{position:relative;background:var(--surface);border-radius:20px;border:1px solid var(--border);box-shadow:0 20px 60px #0003;width:90%;max-width:600px;max-height:80vh;display:flex;flex-direction:column;animation:scaleIn .3s ease-out}@keyframes scaleIn{0%{transform:scale(.9);opacity:0}to{transform:scale(1);opacity:1}}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}.modal-header{padding:32px 32px 24px;border-bottom:1px solid var(--border)}.modal-header h2{font-size:24px;font-weight:700;color:var(--text-primary);margin-bottom:8px}.modal-header p{font-size:14px;color:var(--text-secondary)}.modal-body{padding:24px 32px;overflow-y:auto;flex:1}.modal-footer{padding:20px 32px;border-top:1px solid var(--border);display:flex;justify-content:flex-end;gap:12px}.certificates-list{display:flex;flex-direction:column;gap:12px}.certificate-item{background:var(--surface);border:2px solid var(--border);border-radius:16px;padding:20px;display:flex;align-items:center;gap:16px;cursor:pointer;transition:all .3s ease}.certificate-item:hover{border-color:#1a6b7a80;background:var(--surface-hover);transform:translate(4px)}.certificate-item.selected{border-color:#1a6b7a;background:#1a6b7a0d}.cert-icon{width:48px;height:48px;background:var(--primary-gradient);border-radius:12px;display:flex;align-items:center;justify-content:center;flex-shrink:0}.cert-icon svg{width:24px;height:24px;color:#fff}.cert-info{flex:1}.cert-name{font-size:16px;font-weight:600;color:var(--text-primary);margin-bottom:4px}.cert-details{display:flex;flex-wrap:wrap;gap:12px;margin-top:8px}.cert-detail{display:flex;align-items:center;gap:4px;font-size:13px;color:var(--text-secondary)}.cert-detail svg{width:14px;height:14px}.cert-badge{padding:4px 10px;border-radius:6px;font-size:11px;font-weight:600;text-transform:uppercase}.cert-badge.valid{background:#10b9811a;color:var(--success)}.cert-badge.expiring{background:#f59e0b1a;color:#f59e0b}.cert-check{width:24px;height:24px;border:2px solid var(--border);border-radius:50%;display:flex;align-items:center;justify-content:center;flex-shrink:0;transition:all .3s ease}.certificate-item.selected .cert-check{background:#1a6b7a;border-color:#1a6b7a}.cert-check svg{width:14px;height:14px;color:#fff;opacity:0;transition:opacity .3s ease}.certificate-item.selected .cert-check svg{opacity:1}.certificates-loading{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:40px;gap:16px}.certificates-loading .spinner,.spinner{width:40px;height:40px;border:3px solid var(--border);border-top-color:#1a6b7a;border-radius:50%;animation:spin .8s linear infinite}.certificates-loading p{color:var(--text-secondary);font-size:14px}.dashboard-container{position:fixed;top:0;left:0;width:100%;height:100%;z-index:10;background:var(--bg-primary);animation:fadeIn .5s ease-out}.dashboard-header{background:var(--surface);border-bottom:1px solid var(--border);box-shadow:0 2px 10px #0000000d;position:fixed;top:0;left:0;right:0;z-index:100}.header-content{max-width:1400px;margin:0 auto;padding:16px 32px;display:flex;align-items:center;justify-content:space-between}.logo{display:flex;align-items:center;gap:12px;font-size:18px;font-weight:600;color:var(--text-primary)}.user-menu{display:flex;align-items:center;gap:16px}.user-avatar-small{width:40px;height:40px;background:var(--primary-gradient);border-radius:10px;display:flex;align-items:center;justify-content:center}.user-avatar-small svg{width:20px;height:20px;color:#fff}.user-info-header{display:flex;flex-direction:column;gap:2px}.user-name-header{font-size:14px;font-weight:600;color:var(--text-primary)}.user-role{font-size:12px;color:var(--text-secondary)}.logout-btn{width:36px;height:36px;border-radius:8px;border:1px solid var(--border);background:var(--surface);display:flex;align-items:center;justify-content:center;cursor:pointer;transition:all .2s ease}.logout-btn:hover{background:var(--surface-hover);border-color:var(--text-secondary);transform:translateY(-1px)}.logout-btn svg{width:18px;height:18px;color:var(--text-secondary)}.dashboard-main{overflow-y:auto;height:100vh;max-width:1400px;margin:0 auto;padding:80px 32px 40px}.welcome-section{margin-bottom:32px}.welcome-card{background:var(--surface);border:1px solid var(--border);border-radius:20px;padding:32px;display:flex;align-items:center;gap:24px;box-shadow:0 4px 16px #00000014;transition:all .3s ease}.welcome-card:hover{box-shadow:0 10px 40px #0000001f;transform:translateY(-2px)}.welcome-icon{flex-shrink:0}.checkmark-small{width:60px;height:60px}.checkmark-circle-small{stroke:#10b981;stroke-width:2;stroke-dasharray:166;stroke-dashoffset:0}.checkmark-check-small{stroke:#10b981;stroke-width:3;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:48;stroke-dashoffset:0}.welcome-text{flex:1}.welcome-text h1{font-size:24px;font-weight:700;color:var(--text-primary);margin-bottom:4px}.welcome-text h1 span{background:var(--primary-gradient);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.welcome-text p{font-size:14px;color:var(--text-secondary)}.cert-badge-dashboard{display:flex;align-items:center;gap:8px;padding:10px 16px;background:#10b98114;border:1px solid rgba(16,185,129,.2);border-radius:12px;color:var(--success);font-size:13px;font-weight:600;flex-shrink:0}.cert-badge-dashboard svg{width:16px;height:16px}.stats-section{display:grid;grid-template-columns:repeat(4,1fr);gap:20px;margin-bottom:32px}.stat-card{background:var(--surface);border:1px solid var(--border);border-radius:16px;padding:24px;display:flex;align-items:center;gap:16px;box-shadow:0 4px 16px #00000014;transition:all .3s ease}.stat-card:hover{box-shadow:0 10px 40px #0000001f;transform:translateY(-4px)}.stat-icon{width:48px;height:48px;border-radius:12px;display:flex;align-items:center;justify-content:center;flex-shrink:0}.stat-icon svg{width:24px;height:24px;color:#fff}.stat-content h3{font-size:28px;font-weight:700;color:var(--text-primary);margin-bottom:4px}.stat-content p{font-size:13px;color:var(--text-secondary)}.actions-section{margin-bottom:32px}.actions-section h2{font-size:20px;font-weight:600;color:var(--text-primary);margin-bottom:16px}.actions-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:20px}.action-card{background:var(--surface);border:1px solid var(--border);border-radius:16px;padding:24px;display:flex;flex-direction:column;align-items:center;text-align:center;cursor:pointer;transition:all .3s ease;box-shadow:0 4px 16px #00000014;font-family:inherit}.action-card:hover{box-shadow:0 10px 40px #0000001f;transform:translateY(-4px);border-color:#1a6b7a4d}.action-icon{width:56px;height:56px;background:var(--primary-gradient);border-radius:14px;display:flex;align-items:center;justify-content:center;margin-bottom:16px;transition:all .3s ease}.action-card:hover .action-icon{transform:scale(1.1)}.action-icon svg{width:28px;height:28px;color:#fff}.action-card h3{font-size:16px;font-weight:600;color:var(--text-primary);margin-bottom:6px}.action-card p{font-size:13px;color:var(--text-secondary);line-height:1.4}.activity-section h2{font-size:20px;font-weight:600;color:var(--text-primary);margin-bottom:16px}.activity-list{background:var(--surface);border:1px solid var(--border);border-radius:16px;box-shadow:0 4px 16px #00000014;overflow:hidden}.activity-item{display:flex;align-items:flex-start;gap:16px;padding:20px;border-bottom:1px solid var(--border);transition:all .2s ease}.activity-item:last-child{border-bottom:none}.activity-item:hover{background:var(--surface-hover)}.activity-icon{width:40px;height:40px;border-radius:10px;display:flex;align-items:center;justify-content:center;flex-shrink:0}.activity-icon.success{background:#10b9811a;color:var(--success)}.activity-icon.info{background:#4facfe1a;color:#4facfe}.activity-icon svg{width:20px;height:20px}.activity-content{flex:1}.activity-content h4{font-size:15px;font-weight:600;color:var(--text-primary);margin-bottom:4px}.activity-content p{font-size:13px;color:var(--text-secondary);margin-bottom:4px}.activity-time{font-size:12px;color:var(--text-secondary)}@media(max-width:1024px){.stats-section,.actions-grid{grid-template-columns:repeat(2,1fr)}}@media(max-width:640px){.container{max-width:100%;padding:16px}.card-header{padding:32px 24px 24px}.card-body{padding:0 24px 24px}.dashboard-main{padding-left:16px;padding-right:16px}.header-content{padding:12px 16px}.welcome-card{flex-direction:column;text-align:center;padding:24px}.stats-section,.actions-grid{grid-template-columns:1fr}.user-info-header{display:none}.modal-content{width:95%;max-height:90vh}.modal-header,.modal-body,.modal-footer{padding-left:20px;padding-right:20px}.certificate-item{flex-direction:column;text-align:center}.cert-details{justify-content:center}}.file-explorer-section{animation:fadeInUp .5s ease-out}.file-explorer-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:20px}.file-explorer-title{display:flex;align-items:center;gap:14px}.file-explorer-title .folder-icon{width:32px;height:32px;color:var(--primary)}.file-explorer-title h2{font-size:22px;font-weight:700;color:var(--text-primary);margin-bottom:2px}.file-explorer-path{font-size:13px;color:var(--text-secondary);font-family:Consolas,monospace}.btn-refresh{width:40px;height:40px;border-radius:10px;border:1px solid var(--border);background:var(--surface);display:flex;align-items:center;justify-content:center;cursor:pointer;transition:all .3s ease}.btn-refresh:hover{background:var(--surface-hover);border-color:var(--primary);transform:rotate(180deg)}.btn-refresh svg{width:18px;height:18px;color:var(--text-secondary)}.btn-refresh:hover svg{color:var(--primary)}.file-explorer-controls{display:flex;gap:16px;margin-bottom:20px;flex-wrap:wrap}.search-box{flex:1;min-width:200px;display:flex;align-items:center;gap:10px;padding:12px 16px;background:var(--surface);border:1px solid var(--border);border-radius:12px;transition:all .3s ease}.search-box:focus-within{border-color:var(--primary);box-shadow:0 0 0 3px #1a6b7a1a}.search-box svg{width:18px;height:18px;color:var(--text-secondary);flex-shrink:0}.search-box input{flex:1;border:none;background:none;outline:none;font-size:14px;color:var(--text-primary);font-family:inherit}.search-box input::placeholder{color:var(--text-secondary)}.filter-buttons{display:flex;gap:8px}.filter-btn{padding:10px 18px;border-radius:10px;border:1px solid var(--border);background:var(--surface);cursor:pointer;font-size:13px;font-weight:600;color:var(--text-secondary);transition:all .3s ease;font-family:inherit}.filter-btn:hover{border-color:var(--primary);color:var(--primary)}.filter-btn.active{background:var(--primary);border-color:var(--primary);color:#fff}.filter-btn.pdf.active{background:#dc2626;border-color:#dc2626}.filter-btn.excel.active{background:#16a34a;border-color:#16a34a}.file-list{display:flex;flex-direction:column;gap:8px}.file-card{background:var(--surface);border:1px solid var(--border);border-radius:14px;padding:16px 20px;display:flex;align-items:center;gap:16px;cursor:pointer;transition:all .25s ease;box-shadow:0 2px 8px #0000000a}.file-card:hover{border-color:#1a6b7a4d;box-shadow:0 6px 20px #00000014;transform:translate(4px)}.file-icon-wrapper{width:48px;height:48px;border-radius:12px;display:flex;align-items:center;justify-content:center;flex-shrink:0}.file-icon-wrapper.pdf{background:#dc262614;color:#dc2626}.file-icon-wrapper.excel{background:#16a34a14;color:#16a34a}.file-type-icon{width:28px;height:28px}.file-info{flex:1;min-width:0}.file-name{font-size:15px;font-weight:600;color:var(--text-primary);margin-bottom:6px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.file-meta{display:flex;align-items:center;gap:12px;flex-wrap:wrap}.file-type-badge{padding:2px 8px;border-radius:4px;font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.5px}.file-type-badge.pdf{background:#dc26261a;color:#dc2626}.file-type-badge.excel{background:#16a34a1a;color:#16a34a}.file-size,.file-date{font-size:12px;color:var(--text-secondary)}.file-action{width:32px;height:32px;display:flex;align-items:center;justify-content:center;border-radius:8px;transition:all .2s ease;flex-shrink:0;opacity:0}.file-card:hover .file-action{opacity:1}.file-action svg{width:16px;height:16px;color:var(--primary)}.file-loading,.file-empty{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:60px 20px;gap:16px;background:var(--surface);border:1px solid var(--border);border-radius:16px}.file-loading p,.file-empty p{color:var(--text-secondary);font-size:14px;text-align:center}.file-empty svg{width:48px;height:48px;color:var(--text-secondary);opacity:.5}.file-error{display:flex;align-items:center;gap:16px;padding:24px;background:#ef44440f;border:1px solid rgba(239,68,68,.15);border-radius:14px}.file-error svg{width:24px;height:24px;color:var(--error);flex-shrink:0}.file-error h4{font-size:15px;font-weight:600;color:var(--error);margin-bottom:4px}.file-error p{font-size:13px;color:var(--text-secondary)}.file-error .btn-secondary{margin-left:auto;flex-shrink:0}@media(max-width:640px){.file-explorer-controls{flex-direction:column}.filter-buttons{width:100%}.filter-btn{flex:1;text-align:center}.file-card{padding:14px 16px}.file-name{font-size:14px}}:root{--bg-primary: #f0f4f5;--bg-secondary: #e4ecee;--surface: rgba(255, 255, 255, .95);--surface-hover: rgba(245, 249, 250, .98);--text-primary: #1a2e3a;--text-secondary: #5a7a8a;--border: rgba(0, 0, 0, .08);--primary: #1a6b7a;--primary-dark: #145a67;--primary-gradient: linear-gradient(135deg, #1a6b7a 0%, #2d8fa3 100%);--success: #10b981;--error: #ef4444;--warning: #f59e0b;--shadow-sm: 0 2px 8px rgba(0, 0, 0, .04);--shadow-md: 0 4px 16px rgba(0, 0, 0, .08);--shadow-lg: 0 10px 40px rgba(0, 0, 0, .12)}*{margin:0;padding:0;box-sizing:border-box}body{font-family:Inter,-apple-system,system-ui,sans-serif;background:var(--bg-primary);color:var(--text-primary);min-height:100vh;overflow-x:hidden}#root{min-height:100vh}