.skill-card{position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:1.5rem;min-width:140px;min-height:140px;border-radius:20px;overflow:hidden;transition:all .4s cubic-bezier(.175,.885,.32,1.275);cursor:pointer;border:none;background:transparent;z-index:1}.skill-card-bg{position:absolute;inset:0;background:linear-gradient(135deg,#2d141866,#1a0d0f99,#4a0e1d66);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border-radius:inherit;transition:all .4s ease;z-index:-3}.skill-card-border{position:absolute;inset:0;background:linear-gradient(135deg,rgba(194,24,91,.2) 0%,transparent 40%,transparent 60%,rgba(233,30,99,.2) 100%);border-radius:inherit;opacity:0;transition:opacity .4s ease;z-index:-2}.skill-card-glow{position:absolute;inset:-2px;background:linear-gradient(45deg,#c2185b99,#e91e6366,#8e153899,#e91e6366,#c2185b99);border-radius:22px;opacity:0;transition:all .4s ease;z-index:-4;animation:rotating 8s linear infinite}@keyframes rotating{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.skill-card:hover{transform:translateY(-8px) scale(1.05);box-shadow:0 20px 40px #0000004d,0 0 30px #c2185b33}.skill-card:hover .skill-card-bg{background:linear-gradient(135deg,#2d141899,#1a0d0fcc,#4a0e1d99)}.skill-card:hover .skill-card-border,.skill-card:hover .skill-card-glow{opacity:1}.skill-card-content{position:relative;display:flex;flex-direction:column;align-items:center;gap:1rem;z-index:2}.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%);transition:all .3s ease;width:36px;height:36px;background:linear-gradient(135deg,#1a0d0fe6,#2d1418cc,#4a0e1db3);border-radius:50%;display:flex;align-items:center;justify-content:center;box-shadow:0 0 8px #c2185b33,inset 0 1px 2px #0000004d}.skill-card:hover .skill-icon-wrapper{transform:translate(-50%,-50%) scale(1.1) rotate(5deg);background:linear-gradient(135deg,#c2185b66,#8e153880,#e91e634d);box-shadow:0 0 16px #c2185b66,inset 0 1px 2px #0006}.skill-icon{width:24px;height:24px;color:#f8f9fa;filter:drop-shadow(0 0 6px rgba(248,249,250,.3));transition:all .3s ease;border-radius:50%}.skill-card:hover .skill-icon{color:#c2185b;filter:drop-shadow(0 0 8px rgba(194,24,91,.6))}.skill-name-container{display:flex;flex-direction:column;align-items:center;gap:.5rem;min-height:40px}.skill-name{font-size:.75rem;font-weight:600;color:#f8f9fa;text-align:center;line-height:1.2;transition:all .3s ease;text-shadow:0 1px 2px rgba(0,0,0,.5)}.skill-card:hover .skill-name{color:#c2185b;transform:translateY(-2px)}.skill-level-indicator{width:60px;height:2px;background:#2d14184d;border-radius:1px;overflow:hidden;position:relative}.skill-level-bar{height:100%;background:linear-gradient(90deg,#c2185b,#e91e63);border-radius:1px;transition:all .6s ease;box-shadow:0 0 4px #c2185b66}.skill-card:hover .skill-level-bar{box-shadow:0 0 8px #c2185bcc}.skill-particles{position:absolute;inset:0;pointer-events:none;z-index:1}.particle{position:absolute;width:4px;height:4px;background:#c2185b99;border-radius:50%;opacity:0;transition:all .4s ease}.skill-card:hover .particle{opacity:1;animation:float 3s ease-in-out infinite}.particle-1{top:20%;right:15%;animation-delay:0s}.particle-2{bottom:30%;left:20%;animation-delay:1s}.particle-3{top:60%;right:25%;animation-delay:2s}@keyframes float{0%,to{transform:translateY(0) rotate(0);opacity:.6}33%{transform:translateY(-10px) rotate(120deg);opacity:1}66%{transform:translateY(5px) rotate(240deg);opacity:.8}}.skill-card:active{transform:translateY(-4px) scale(.98)}.modal-content{position:relative;width:90vw;max-width:600px;max-height:80vh;margin:0 1rem;transition:all .3s cubic-bezier(.175,.885,.32,1.275)}.modal-bg{position:absolute;inset:0;background:linear-gradient(135deg,#1a0d0ff2,#2d1418e6,#1a0d0ff2);-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);border-radius:24px;z-index:-2}.modal-border{position:absolute;inset:-1px;background:linear-gradient(135deg,rgba(194,24,91,.6) 0%,rgba(233,30,99,.3) 25%,transparent 50%,rgba(233,30,99,.3) 75%,rgba(194,24,91,.6) 100%);border-radius:25px;z-index:-3;animation:modalBorderGlow 4s ease-in-out infinite}@keyframes modalBorderGlow{0%,to{opacity:.6}50%{opacity:1}}.modal-inner{position:relative;padding:2rem;border-radius:24px;overflow:hidden;z-index:1}.modal-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:2rem;padding-bottom:1rem;border-bottom:1px solid rgba(194,24,91,.2)}.modal-title-container{display:flex;align-items:center;gap:.75rem}.modal-title-icon{display:flex;align-items:center;justify-content:center;width:40px;height:40px;background:linear-gradient(135deg,#c2185b,#e91e63);border-radius:12px;color:#f8f9fa;box-shadow:0 4px 12px #c2185b4d}.modal-title{font-size:1.5rem;font-weight:700;color:#f8f9fa;margin:0;text-shadow:0 1px 2px rgba(0,0,0,.3)}.modal-close-btn{display:flex;align-items:center;justify-content:center;width:40px;height:40px;background:linear-gradient(135deg,#c2185b33,#e91e6333);border:1px solid rgba(194,24,91,.3);border-radius:12px;color:#f8f9fa;cursor:pointer;transition:all .3s ease;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}.modal-close-btn:hover{background:linear-gradient(135deg,#c2185b66,#e91e6366);border-color:#c2185b99;transform:scale(1.1);box-shadow:0 4px 12px #c2185b4d}.modal-body{overflow-y:auto;max-height:calc(80vh - 120px)}.modal-text{color:#f8f9fae6;font-size:1.1rem;line-height:1.7;text-align:justify;text-shadow:0 1px 2px rgba(0,0,0,.2)}.modal-overlay{position:fixed;inset:0;background:linear-gradient(135deg,#1a0d0fe6,#2d1418cc,#4a0e1de6);-webkit-backdrop-filter:blur(15px);backdrop-filter:blur(15px);display:flex;align-items:center;justify-content:center;z-index:1000;transition:all .3s ease-in-out;padding:1rem}@media (max-width: 768px){.skill-card{min-width:120px;min-height:120px;padding:1rem}.skill-icon{width:24px;height:24px}.skill-name{font-size:.7rem}.skill-level-indicator{width:50px}}