.skill-card{position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:1.5rem 1rem;width:160px;height:160px;border-radius:16px;cursor:pointer;border:1px solid rgba(139,92,246,.15);background:#121218b3;backdrop-filter:blur(12px);transition:all .25s cubic-bezier(.16,1,.3,1);z-index:1;overflow:hidden}.skill-card:before{content:"";position:absolute;top:0;left:20%;right:20%;height:1px;background:linear-gradient(90deg,transparent,rgba(167,139,250,.8),transparent);opacity:0;transition:opacity .25s ease}.skill-card:hover{transform:translateY(-6px);border-color:#8b5cf673;background:#1e1b4b80;box-shadow:0 16px 40px #00000059,0 0 24px #8b5cf61f}.skill-card:hover:before{opacity:1}.skill-card:active{transform:translateY(-3px) scale(.98)}.skill-card-content{position:relative;display:flex;flex-direction:column;align-items:center;gap:.75rem;z-index:2;width:100%}.skill-progress-container{position:relative;display:flex;align-items:center;justify-content:center}.skill-icon-wrapper{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:36px;height:36px;background:#09090bcc;border-radius:50%;display:flex;align-items:center;justify-content:center;transition:all .25s ease;box-shadow:0 0 8px #8b5cf626}.skill-card:hover .skill-icon-wrapper{background:#1e1b4be6;box-shadow:0 0 16px #8b5cf64d;transform:translate(-50%,-50%) scale(1.08)}.skill-icon{width:22px;height:22px;color:#f4f4f5;transition:all .25s ease}.skill-card:hover .skill-icon{color:#c4b5fd}.skill-name-container{display:flex;flex-direction:column;align-items:center;gap:.35rem;width:100%}.skill-name{font-size:.72rem;font-weight:600;color:#f4f4f5d9;text-align:center;line-height:1.2;transition:color .25s ease;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:100%}.skill-card:hover .skill-name{color:#f4f4f5}.skill-proficiency{font-size:.6rem;font-weight:500;padding:.1rem .5rem;border-radius:999px;letter-spacing:.04em;text-transform:uppercase;transition:all .25s ease}.skill-proficiency.expert{color:#a78bfa;background:#8b5cf626}.skill-proficiency.advanced{color:#67e8f9;background:#06b6d41f}.skill-proficiency.proficient{color:#86efac;background:#22c55e1f}.skill-proficiency.learning{color:#94a3b8;background:#94a3b81a}.skill-level-indicator{width:100%;height:2px;background:#ffffff0f;border-radius:1px;overflow:hidden}.skill-level-bar{height:100%;background:linear-gradient(90deg,#6d28d9,#a78bfa);border-radius:1px;transition:box-shadow .25s ease}.skill-card:hover .skill-level-bar{box-shadow:0 0 6px #8b5cf699}.modal-overlay{position:fixed;inset:0;background:#09090bcc;backdrop-filter:blur(16px);display:flex;align-items:center;justify-content:center;z-index:1000;padding:1rem;transition:opacity .3s ease}.modal-content{position:relative;width:90vw;max-width:560px;max-height:80vh;transition:all .3s cubic-bezier(.16,1,.3,1)}.modal-bg{position:absolute;inset:0;background:#0f0f14f7;backdrop-filter:blur(20px);border-radius:20px;z-index:-2}.modal-border{position:absolute;inset:-1px;background:linear-gradient(135deg,rgba(139,92,246,.5) 0%,rgba(167,139,250,.2) 40%,transparent 60%,rgba(139,92,246,.3) 100%);border-radius:21px;z-index:-3;animation:modalBorderGlow 4s ease-in-out infinite}@keyframes modalBorderGlow{0%,to{opacity:.7}50%{opacity:1}}.modal-inner{position:relative;padding:2rem;border-radius:20px;overflow:hidden;z-index:1}.modal-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:1.5rem;padding-bottom:1rem;border-bottom:1px solid rgba(139,92,246,.15)}.modal-title-container{display:flex;align-items:center;gap:.75rem}.modal-title-icon{display:flex;align-items:center;justify-content:center;width:36px;height:36px;background:linear-gradient(135deg,#6d28d9,#8b5cf6);border-radius:10px;color:#f4f4f5;box-shadow:0 4px 12px #8b5cf64d}.modal-title{font-size:1.25rem;font-weight:700;color:#f4f4f5;margin:0}.modal-close-btn{display:flex;align-items:center;justify-content:center;width:36px;height:36px;background:#8b5cf61a;border:1px solid rgba(139,92,246,.2);border-radius:10px;color:#f4f4f5;cursor:pointer;transition:all .2s ease}.modal-close-btn:hover{background:#8b5cf640;border-color:#8b5cf680;transform:scale(1.05)}.modal-body{overflow-y:auto;max-height:calc(80vh - 120px)}.modal-text{color:#f4f4f5bf;font-size:1rem;line-height:1.75}@keyframes skillFadeUp{0%{opacity:0;transform:translateY(22px)}to{opacity:1;transform:translateY(0)}}.skill-card-wrap{opacity:0}.skill-card-wrap.animate{animation:skillFadeUp .5s cubic-bezier(.16,1,.3,1) forwards;animation-delay:calc(.3s + min(var(--i, 0) * 80ms,.6s))}@media(max-width:768px){.skill-card{width:130px;height:130px;padding:1rem .75rem}}
