.counter-demo{display:flex;flex-direction:column;align-items:center;gap:30px;padding:40px 20px;background:#fff;border-radius:12px;box-shadow:0 2px 8px #0000001a;max-width:400px;margin:0 auto}.counter-display{background:linear-gradient(135deg,#667eea,#764ba2);color:#fff;width:120px;height:120px;border-radius:50%;display:flex;align-items:center;justify-content:center;box-shadow:0 4px 16px #0003}.count-value{font-size:2.5rem;font-weight:700}.step-control{display:flex;align-items:center;gap:12px}.step-control label{font-weight:500;color:#333}.step-input{padding:8px 12px;border:2px solid #e9ecef;border-radius:6px;font-size:1rem;width:80px;text-align:center}.step-input:focus{outline:none;border-color:#007bff}.counter-controls{display:flex;gap:12px}.btn{padding:12px 24px;border:none;border-radius:6px;font-size:1rem;font-weight:500;cursor:pointer;transition:all .2s;min-width:80px}.btn:hover{transform:translateY(-1px);box-shadow:0 2px 8px #00000026}.btn-success{background-color:#28a745;color:#fff}.btn-success:hover{background-color:#218838}.btn-danger{background-color:#dc3545;color:#fff}.btn-danger:hover{background-color:#c82333}.btn-secondary{background-color:#6c757d;color:#fff}.btn-secondary:hover{background-color:#5a6268}.nested-content{margin-left:20px}.file-item{display:flex;align-items:center;padding:4px 0;color:#555;font-family:Courier New,monospace}.folder-item{display:flex;align-items:center;padding:4px 0;font-weight:700;color:#333;font-family:Courier New,monospace}.folder-structure-container{background-color:#f8f9fa;border:1px solid #e9ecef;border-radius:8px;padding:20px;font-family:Courier New,monospace;font-size:14px}.problem-container{max-width:800px;margin:0 auto;padding:20px}.problem-container h2{color:#333;margin-bottom:10px}.problem-container p{color:#666;margin-bottom:20px}.signal-wrapper{display:flex;justify-content:center;align-items:center;height:100vh;background-color:#f0f0f0}.signal-container{display:flex;flex-direction:column;align-items:center;justify-content:center;width:80px;background-color:#000;padding:8px;border-radius:16px}.signal-light{width:48px;height:48px;border-radius:50%;margin:8px 0}.red{background-color:red}.yellow{background-color:#e2e219}.green{background-color:#1bcb1b}.active{box-shadow:0 0 20px 5px #ffffffb3;animation:glow 1s infinite alternate}.inactive{opacity:.4}.users-container{display:grid;grid-template-columns:repeat(auto-fit,minmax(350px,1fr));gap:20px;margin-top:20px}.user-card{background:#fff;border-radius:12px;padding:20px;box-shadow:0 2px 8px #0000001a;border:1px solid #e9ecef;transition:transform .2s,box-shadow .2s}.user-card:hover{transform:translateY(-2px);box-shadow:0 4px 16px #00000026}.user-avatar{width:48px;height:48px;background:linear-gradient(135deg,#667eea,#764ba2);border-radius:50%;display:flex;align-items:center;justify-content:center;color:#fff;font-weight:700;font-size:18px;margin-bottom:16px}.user-info{display:flex;flex-direction:column;gap:12px}.user-header{display:flex;flex-direction:column;gap:4px}.user-name{display:flex;flex-direction:column;gap:2px}.name{font-size:18px;font-weight:600;color:#333}.username{font-size:14px;color:#666;font-weight:500}.email{font-size:14px;color:#007bff;text-decoration:none}.user-details{display:flex;flex-direction:column;gap:8px;padding-top:12px;border-top:1px solid #e9ecef}.detail-item{display:flex;justify-content:space-between;align-items:center;font-size:14px}.label{font-weight:500;color:#666}.loading{text-align:center;padding:40px;font-size:18px;color:#666}.error{text-align:center;padding:40px;font-size:18px;color:#dc3545;background-color:#f8d7da;border:1px solid #f5c6cb;border-radius:8px}.problems-index{max-width:1200px;margin:0 auto;padding:20px}.header{text-align:center;margin-bottom:40px}.header h1{color:#333;font-size:2.5rem;margin-bottom:10px}.header p{color:#666;font-size:1.2rem}.problems-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(350px,1fr));gap:20px;justify-content:center}.problem-card-link{text-decoration:none;color:inherit;display:block}.problem-card{background:#fff;border-radius:12px;padding:24px;box-shadow:0 2px 8px #0000001a;border:1px solid #e9ecef;transition:transform .2s,box-shadow .2s;height:100%}.problem-card:hover{transform:translateY(-2px);box-shadow:0 4px 16px #00000026}.problem-header{display:flex;justify-content:space-between;align-items:flex-start;margin-bottom:12px}.problem-header h3{color:#333;margin:0;font-size:1.3rem}.difficulty{padding:4px 12px;border-radius:20px;font-size:.8rem;font-weight:600;text-transform:uppercase}.difficulty.easy{background-color:#d4edda;color:#155724}.difficulty.medium{background-color:#fff3cd;color:#856404}.difficulty.hard{background-color:#f8d7da;color:#721c24}.problem-description{color:#666;line-height:1.5;margin-bottom:16px}.topics{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:20px}.topic-tag{background-color:#f8f9fa;color:#495057;padding:4px 8px;border-radius:16px;font-size:.8rem;border:1px solid #dee2e6}.problem-action{display:flex;justify-content:center}.solve-button{background-color:#007bff;color:#fff;padding:10px 24px;border-radius:6px;text-decoration:none;font-weight:500;transition:background-color .2s}.solve-button:hover{background-color:#0056b3}.problem-wrapper{max-width:1200px;margin:0 auto;padding:20px;position:relative}.problem-header-section{position:absolute;top:20px;left:0;z-index:10}.back-arrow{font-size:24px;color:#333;text-decoration:none;padding:8px;border-radius:6px;transition:background-color .2s;display:flex;align-items:center;justify-content:center;width:40px;height:40px}.back-arrow:hover{background-color:#f8f9fa}.problem-main-content{padding-left:60px;padding-right:60px}.problem-title{margin:0 0 8px;color:#333;font-size:1.8rem;line-height:1.2}.problem-description{margin:0 0 30px;color:#666;font-size:1rem;line-height:1.5}.problem-content .problem-container{max-width:none;margin:0;padding:0}.problem-content .problem-container h2{display:none}.problem-content .problem-container p:first-of-type{display:none}*{margin:0;padding:0;box-sizing:border-box}body{font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Fira Sans,Droid Sans,Helvetica Neue,sans-serif;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;background-color:#f8f9fa;color:#333}.app{min-height:100vh}.main-content{padding:20px 0}
