:root{font-family:system-ui,Avenir,Helvetica,Arial,sans-serif;line-height:1.5;font-weight:400;color-scheme:light;color:dark;background-color:#fff;font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}a{font-weight:500;color:#646cff;text-decoration:inherit}a:hover{color:#535bf2}body{margin:0;min-width:320px;min-height:100vh}h1{font-size:3.2em;line-height:1.1}button{border-radius:8px;border:1px solid transparent;padding:.6em 1.2em;font-size:1em;font-weight:500;font-family:inherit;background-color:#d3d3d3;cursor:pointer;transition:border-color .25s}button:hover{border-color:#646cff}button:focus,button:focus-visible{outline:4px auto -webkit-focus-ring-color}@media(prefers-color-scheme:light){:root{color:#000;background-color:#fff}a:hover{color:#747bff}button{background-color:#f9f9f9}}#navbar ul{list-style-type:none;margin:0;padding:0;overflow:hidden;display:flex;justify-content:center;font-size:20px}#navbar li{align-content:center;position:relative}#navbar li a:hover{color:#00f}#navbar li a{display:block;color:#000;text-align:center;padding:14px 16px;text-decoration:none;position:relative}#navbar li:before{content:"";position:absolute;bottom:0;left:0;width:0;height:4px;background:linear-gradient(90deg,#00a2ff,#000dff);border-radius:0;transition:all .5s ease-in-out}#navbar li:hover:before{width:100%}#page-header{display:flex;align-items:center;gap:16px;padding:10px 20px}#page-header img{height:120px;width:auto}#page-header h2{font-size:60px;margin:0}.grid-container{display:grid;grid-template-columns:repeat(4,1fr);gap:20px;padding:60px}.grid-container a{color:#000}.card{border:1px solid #000000;border-radius:8px;padding:12px;transition:border .3s,box-shadow .3s}.card:hover{border-color:#000dff;box-shadow:0 0 0 4px #00a2ff33,0 2px 8px #000dff22}.separator-line{border-top:2px solid #000000;width:95%;margin:5px auto}.grid-container{display:grid;grid-template-columns:repeat(4,1fr);gap:20px;padding:60px;opacity:0;animation:fadeIn .4s ease-in forwards}@keyframes fadeIn{to{opacity:1}}@keyframes shimmer{0%{background-position:-200px 0}to{background-position:200px 0}}.skeleton-wrapper{display:flex;justify-content:center;align-items:center}.skeleton{background:linear-gradient(90deg,#0059ff 25%,#004cff,#0400ff 75%);background-size:400% 100%;animation:shimmer 1.5s infinite;border-radius:4px}.skeleton-card{border-radius:8px;border:1px solid #ccc;padding:12px;display:flex;flex-direction:column;gap:10px;height:200px}.skeleton-title{width:70%;height:20px}.skeleton-text{width:100%;height:14px}#user-info{padding:12px;text-align:center}