:root{--primary-purple: #7e22ce;--dark-purple: #1e1b4b;--dark-shadow: #000000;--background-gradient: radial-gradient(circle at center, var(--primary-purple) 0%, var(--dark-shadow) 70%);--text-primary: #f0f0f0;--text-secondary: #a7a7a7;--accent-glow: 0 0 15px rgba(168, 85, 247, .6);--card-background: rgba(255, 255, 255, .005);--border-color: rgba(255, 255, 255, .1);--dark-border-color: rgba(0, 0, 0, .2);--progress-bar-bg: rgba(0, 0, 0, .2);--font-family: "Roboto", sans-serif;--white-transparent: rgba(255, 255, 255, .7);--mdb-btn-bg: var(--primary-purple);--mdb-btn-color: var(--text-primary);--mdb-btn-border-color: var(--primary-purple);--mdb-btn-border-width: 2px;--mdb-btn-border-radius: .5rem;--mdb-btn-box-shadow: 0 4px 9px -4px var(--dark-shadow);--mdb-btn-hover-bg: var(--background-gradient);--mdb-btn-hover-color: #fff;--mdb-btn-hover-border-color: var(--dark-purple);--mdb-btn-focus-box-shadow: 0 0 0 .25rem rgba(126, 34, 206, .25);--mdb-btn-active-bg: #6b21a8;--mdb-btn-active-color: #fff;--mdb-btn-active-border-color: #581c87;--mdb-btn-active-shadow: 0 8px 9px -4px rgba(0, 0, 0, .15), 0 4px 18px 0 rgba(0, 0, 0, .1);--mdb-btn-disabled-color: rgba(240, 240, 240, .65);--mdb-btn-disabled-bg: var(--primary-purple);--mdb-btn-disabled-border-color: var(--primary-purple);--mdb-btn-disabled-opacity: .65;--mdb-body-bg: var(--background-gradient);--mdb-body-color: var(--text-primary);--mdb-surface-bg: var(--card-background);--mdb-surface-color: var(--text-primary);--mdb-border-color: var(--border-color);--mdb-card-bg: var(--card-background);--mdb-card-border-color: var(--border-color);--mdb-form-control-bg: rgba(255, 255, 255, .1);--mdb-form-control-color: var(--text-primary);--mdb-form-control-border-color: var(--border-color);--mdb-form-control-focus-border-color: var(--primary-purple);--mdb-form-control-focus-box-shadow: 0 0 0 .25rem rgba(126, 34, 206, .25)}body{background:var(--background-gradient);color:var(--text-primary);font-family:var(--font-family);min-height:100vh;margin:0;padding:2rem;box-sizing:border-box}hr{border-color:var(--border-color)}.container{max-width:700px;width:100%;text-align:center}header h1{font-size:2.5rem;font-weight:700;color:#fff;text-shadow:0 0 10px rgba(255,255,255,.5)}header p{font-size:1.2rem;color:var(--text-secondary);margin-bottom:2rem}.card{background:var(--card-background);border-radius:20px;padding:2rem;border:1px solid var(--border-color);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);box-shadow:0 8px 32px #0000005e;position:relative;overflow:visible}.card h2{text-align:left;margin-top:0;margin-bottom:2rem;font-weight:600;color:var(--text-primary)}.progress-item{border-radius:20px;display:flex;align-items:center;gap:1.5rem;position:relative;margin:-.5rem 0 1.5rem;padding:.5rem 1.5rem;padding:1rem 1.5rem;transition:margin-left .3s linear,margin-right .3s linear}.item-info{display:flex;align-items:center;gap:1rem;width:200px;font-weight:600}.logo{width:40px;height:40px;border-radius:50%;object-fit:cover;background-color:#fff}.logo-icon{background:var(--white-transparent);border-radius:50%;color:var(--primary-purple);width:40px;height:40px;display:flex;align-items:center;justify-content:center;font-size:1.2rem;box-shadow:0 2px 8px #7e22ce4d}.progress-bar-container{flex-grow:1;background-color:var(--progress-bar-bg);border-radius:25px;height:12px}.progress-bar{background:var(--primary-purple);height:100%;border-radius:25px;box-shadow:var(--dark-shadow);transition:width .5s ease-in-out}.score{font-size:1.5rem;font-weight:700;min-width:40px;text-align:right}.active{background:var(--primary-purple);margin:-.5rem -3.5rem 1.5rem;z-index:10;box-shadow:0 0 30px #0006,0 10px 40px #0000004d,0 0 0 1px #0000001a;backdrop-filter:blur(15px);-webkit-backdrop-filter:blur(15px)}.active:before{content:"";position:absolute;top:-2px;left:-2px;right:-2px;bottom:-2px;background:linear-gradient(135deg,var(--primary-purple),#a855f7,#d946ef);border-radius:22px;z-index:-1;opacity:.3;filter:blur(8px)}.active .item-info2{font-size:1.3rem;color:#fff;text-shadow:0 0 10px rgba(255,255,255,.3)}.active .logo-icon{transform:scale(1.1);box-shadow:0 4px 15px #7e22ce80}.active .progress-bar-container{height:22px;box-shadow:inset 0 2px 4px #0000004d}.active .progress-bar{background:linear-gradient(90deg,#a855f7,#d946ef,#ec4899);box-shadow:0 0 20px #a855f799}.active .score2{font-size:2.2rem;color:#fff;text-shadow:0 0 15px rgba(255,255,255,.5);font-weight:800}