.indicator-card{background:#1e1e3299;border:1px solid rgba(0,201,255,.2);border-radius:16px;padding:var(--spacing-md);display:flex;flex-direction:column;transition:all .3s ease;box-shadow:0 8px 32px #0000005e}.card-header{display:flex;justify-content:space-between;align-items:center;width:100%}.card-title{font-size:.8em;font-weight:300;color:#ccc;margin:0;text-transform:uppercase;text-align:left}.card-icon{color:#00c9ff;opacity:.7}.card-value{font-size:2em;font-weight:700;color:#fff;margin:var(--spacing-sm) 0;line-height:1;width:100%;text-align:left}.percentage-symbol{margin-left:.1em;font-size:.8em;color:#ccc}.card-footer{display:flex;justify-content:space-between;align-items:center;width:100%;margin-top:auto;padding-top:var(--spacing-sm)}.card-period{font-size:var(--font-size-xs);color:#888}.change-indicator{display:flex;align-items:center;gap:.4rem;font-size:var(--font-size-md);font-weight:700;padding:var(--spacing-xs) var(--spacing-sm);border-radius:20px}.change-indicator.positive{color:#38ef7d;background-color:#38ef7d1a}.change-indicator.negative{color:#ff6b6b;background-color:#ff6b6b1a}.change-indicator.neutral{color:#aaa;background-color:#aaaaaa1a}.progress-container{width:100%;margin-bottom:var(--spacing-xs)}.progress-labels{display:flex;justify-content:space-between;margin-bottom:var(--spacing-xs);font-size:var(--font-size-md);font-weight:600;color:#f0f0f0}.progress-bar-background{width:100%;height:25px;background-color:#0000004d;border-radius:20px;padding:3px}.progress-bar-foreground{height:100%;background:linear-gradient(90deg,#5e42a6,#b74e91);border-radius:15px}.annual-goal-container{width:100%;padding:var(--spacing-sm);background:#1e1e3299;border:1px solid rgba(146,254,157,.4);border-radius:20px;box-shadow:0 8px 32px #0000005e;display:flex;flex-direction:column;gap:var(--spacing-xs)}.annual-goal-header{text-align:center}.annual-goal-header h2{font-size:var(--font-size-sm);margin:0;color:#fff}.annual-revenue-display{font-size:var(--font-size-sm);color:#ccc;display:block;margin-top:var(--spacing-xs)}.annual-revenue-display strong{font-size:var(--font-size-lg);font-weight:700;color:#92fe9d}.percentage-display{font-weight:400;font-size:.7em;color:#ccc;margin-left:var(--spacing-sm)}.timeline-wrapper{width:100%;margin:0 auto}.timeline-container{position:relative;width:100%;height:20px}.timeline-bar-background{width:100%;height:13px;background-color:#00000080;border-radius:5px;position:absolute;top:50%;transform:translateY(-50%)}.timeline-bar-foreground{height:100%;background:linear-gradient(90deg,#00c9ff,#b518ca);border-radius:5px;transition:width 1s;box-shadow:0 0 10px #92fe9d80}.milestone-marker{position:absolute;top:50%;transform:translate(-50%,-50%);z-index:2}.marker-icon{font-size:var(--font-size-md);color:#fff;background:#0f0c29;border-radius:50%;display:flex;align-items:center;justify-content:center}.marker-dot{width:12px;height:12px;border:2px solid rgba(255,255,255,.5);border-radius:50%}.milestone-marker.achieved .marker-icon{color:gold}.milestone-cards-container{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--spacing-sm);width:100%;margin-top:var(--spacing-xs)}.milestone-info-card{padding:var(--spacing-sm);border-radius:12px;border:1px solid}.card-content{text-align:center}.card-icon-title{font-size:var(--font-size-lg)}.milestone-info-card h3{font-size:var(--font-size-lg);margin:0}.milestone-revenue-card{font-size:var(--font-size-xs);margin:0 0 var(--spacing-xs) 0}.milestone-info-card hr{border-color:#ffffff1a;margin:var(--spacing-xs) 0}.milestone-bonus-list-card{font-size:var(--font-size-xs);line-height:1.3;list-style:none;padding:0;margin:0}.card-progress-wrapper{margin-top:var(--spacing-sm)}.card-progress-bar-background{height:6px;background-color:#0000004d}.card-progress-bar-foreground{height:100%;background:linear-gradient(90deg,#00c9ff,#92fe9d);border-radius:3px}.card-progress-text{font-size:var(--font-size-xs);text-align:right;margin-top:0}.milestone-info-card.locked{background:#28283c66;border-color:#fff3;color:#8a8a8a}.milestone-info-card.locked .card-icon-title{color:#666}.milestone-info-card.achieved{background:#ffd7001a;border-color:gold;color:#fff}.milestone-info-card.achieved .card-icon-title,.milestone-info-card.achieved h3{color:gold}.milestone-info-card.achieved .card-progress-bar-foreground{background:linear-gradient(90deg,gold,#ffb300)}.ranking-table-container{background:#1e1e3299;border:1px solid rgba(0,201,255,.2);border-radius:16px;padding:var(--spacing-md);width:100%;box-sizing:border-box}.ranking-title{font-size:var(--font-size-sm);font-weight:600;margin:0 0 var(--spacing-md) 0;background:linear-gradient(90deg,#00c9ff,#92fe9d);-webkit-background-clip:text;-webkit-text-fill-color:transparent}.ranking-table{width:100%;border-collapse:separate;border-spacing:0 var(--spacing-sm);font-size:var(--font-size-sm)}.ranking-table th,.ranking-table td{padding:var(--spacing-sm) var(--spacing-md);text-align:left;vertical-align:middle}.ranking-table thead{color:#92fe9d}.ranking-table tbody tr{background-color:#ffffff0d}.ranking-table tbody tr:first-child{background:#ffd70033;border:1px solid #FFD700}.user-name-cell{text-align:left;width:50%}.data-header,.data-cell{text-align:center;font-weight:700;font-size:var(--font-size-xs)}.pos-1{color:gold;text-shadow:0 0 8px #FFD700}.pos-2{color:silver}.pos-3{color:#cd7f32}.login-container{display:flex;justify-content:center;align-items:center;width:100%;height:100vh;animation:fadeIn 1s ease-in-out}.login-box{background:#1e1e32b3;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border:1px solid rgba(0,201,255,.2);border-radius:16px;padding:3rem 4rem;width:100%;max-width:500px;text-align:center;color:#fff;box-shadow:0 8px 32px #0000005e}.login-icon{color:#00c9ff;margin-bottom:1.5rem}.login-box h1{font-size:2.5em;margin:0 0 .5rem}.login-box p{font-size:1.1em;color:#ccc;margin-bottom:2rem}.password-input{width:100%;padding:1rem;font-size:1.2em;border-radius:8px;border:1px solid #555;background-color:#242424;color:#fff;text-align:center;margin-bottom:1rem;box-sizing:border-box}.submit-button{width:100%;padding:1rem;font-size:1.2em;font-weight:700;border-radius:8px;border:none;cursor:pointer;color:#1a1a1a;background:linear-gradient(90deg,#00c9ff,#92fe9d);transition:transform .2s ease,box-shadow .2s ease}.submit-button:hover{transform:scale(1.02);box-shadow:0 0 20px #00c9ff80}.error-message-login{color:#ff6b6b;font-weight:700;margin-top:0}.sale-notification-container{position:fixed;top:5%;left:50%;transform:translate(-50%);width:90%;max-width:700px;background:linear-gradient(135deg,gold,#fbb034);color:#1a1a1a;border-radius:16px;padding:1.5rem;box-shadow:0 10px 30px #0006;display:flex;align-items:center;z-index:1000;border:2px solid #fff}.notification-icon{font-size:3em;margin-right:1.5rem;animation:pulse 1.5s infinite}.notification-text h4{margin:0 0 .25rem;font-size:1.8em;text-transform:uppercase}.notification-text p{margin:0;font-size:1.2em}@keyframes pulse{0%{transform:scale(1)}50%{transform:scale(1.1)}to{transform:scale(1)}}.size-controls-container{position:fixed;bottom:20px;right:20px;z-index:10000;background-color:#000000b3;border-radius:50px;display:flex;align-items:center;gap:10px;padding:8px;box-shadow:0 4px 12px #0006}.size-control-button{background-color:#00c9ff;color:#fff;border:none;border-radius:50%;width:40px;height:40px;font-size:24px;font-weight:700;cursor:pointer;display:flex;justify-content:center;align-items:center;transition:background-color .2s ease}.size-control-button:hover{background-color:#00a8d9}.size-control-value{color:#fff;font-size:18px;font-weight:600;min-width:50px;text-align:center}.App{display:flex;flex-direction:column;height:100%}nav{flex-shrink:0;display:flex;justify-content:center;gap:var(--spacing-md);padding:var(--spacing-sm);margin-bottom:var(--spacing-md);background:#ffffff0d;border-radius:50px}nav a{font-weight:600;color:#a0a0a0;text-decoration:none;font-size:var(--font-size-md);padding:var(--spacing-xs) var(--spacing-md);border-radius:40px}nav a.active{color:#fff;background:linear-gradient(90deg,#00c9ff,#92fe9d)}main{flex-grow:1;overflow:hidden;display:flex;flex-direction:column}.screen-container{padding:var(--spacing-sm) 0;height:100%;display:flex;flex-direction:column}.screen-title{font-size:var(--font-size-xxl);margin:0 0 var(--spacing-sm) 0;font-weight:700;color:#f9f9f9}.goals-grid{display:flex;flex-direction:column;gap:var(--spacing-md)}.kpi-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--spacing-md)}.ranking-container{display:flex;justify-content:space-around;flex-wrap:wrap;gap:var(--spacing-md)}.ranking-column{min-width:300px;flex-basis:45%;flex-grow:1}.loading-message,.error-message{font-size:var(--font-size-lg);height:100%;display:flex;justify-content:center;align-items:center}.error-message{color:#ffc1c1;padding:var(--spacing-xl)}.goals-card-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:var(--spacing-lg);width:100%}.goal-card{background:#1e1e3299;border:1px solid rgba(146,254,157,.2);border-radius:16px;padding:var(--spacing-md);display:flex;flex-direction:column;align-items:center;text-align:center}.goal-card-header{display:flex;align-items:center;gap:.8rem;margin-bottom:var(--spacing-md);color:#92fe9d}.goal-card-header h3{margin:0;font-size:var(--font-size-lg);font-weight:600}.goal-card-body{position:relative;display:flex;justify-content:center;align-items:center;margin-bottom:var(--spacing-md)}.progress-ring{transform:rotate(-90deg)}.progress-ring-bg{fill:none;stroke:#0000004d;stroke-width:10}.progress-ring-fg{fill:none;stroke:#92fe9d;stroke-width:10;stroke-linecap:round;transition:stroke-dashoffset 1s ease-out}.progress-text{position:absolute;font-size:var(--font-size-lg);font-weight:700;color:#fff}.goal-card-footer{font-size:var(--font-size-md);color:#fff}.goal-max{color:#aaa;font-size:.8em}.inline-progress-background{width:100%;height:8px;background-color:#ffffff1a;border-radius:4px;overflow:hidden}.inline-progress-foreground{height:100%;background:linear-gradient(90deg,#00c9ff,#92fe9d);border-radius:4px;transition:width .5s ease-in-out}:root{--font-size-xs: .9rem;--font-size-sm: 1.1rem;--font-size-md: 1.3rem;--font-size-lg: 2.2rem;--font-size-xl: 3rem;--font-size-xxl: 3.2rem;--spacing-sm: .5rem;--spacing-md: 1rem;--spacing-lg: 1.5rem;--spacing-xl: 2rem;font-family:Poppins,sans-serif;line-height:1.5;color:#ffffffde;background-color:#1a1a1a}*,*:before,*:after{box-sizing:border-box}body{margin:0;min-height:100vh;background:#0f0c29;background:-webkit-linear-gradient(to right,#24243e,#302b63,#0f0c29);background:linear-gradient(to right,#24243e,#302b63,#0f0c29);overflow:hidden}#root{width:100%;max-width:1800px;height:100vh;margin:0 auto;padding:var(--spacing-md);text-align:center;display:flex;flex-direction:column}@media (max-height: 1080px){:root{--font-size-xs: .6rem;--font-size-sm: .8rem;--font-size-md: .9rem;--font-size-lg: 1.4rem;--font-size-xl: 2rem;--font-size-xxl: 2.4rem;--spacing-sm: .3rem;--spacing-md: .5rem;--spacing-lg: .9rem;--spacing-xl: 1.4rem}#root{padding:var(--spacing-md) var(--spacing-lg)}}
