.login-container{display:flex;align-items:center;justify-content:center;min-height:100vh;background:#f5f5f5;padding:1rem}.login-box{width:100%;max-width:400px;background:#fff;border-radius:8px;box-shadow:0 2px 8px #0000001a;padding:2rem}.login-title{font-size:1.5rem;margin-bottom:1rem;text-align:center}.login-form{display:flex;flex-direction:column}.form-group{margin-bottom:1rem}.form-label{font-weight:600;margin-bottom:.5rem;display:block}.form-input{width:100%;padding:.75rem;border:1px solid #ccc;border-radius:4px;font-size:1rem}.login-button{background:#007bff;border:none;color:#fff;padding:.75rem;font-size:1rem;border-radius:4px;cursor:pointer;margin-top:1rem;transition:background .2s}.login-button:hover{background:#0056b3}@media screen and (max-width: 480px){.login-box{padding:1.5rem}.login-title{font-size:1.4rem}}.navigation-container{position:fixed;top:0;left:0;height:100vh;background:linear-gradient(135deg,#2c2c2c,#16213e);border-right:1px solid #444;color:#f1f1f1;transition:width .3s ease-in-out;overflow:hidden;z-index:100}.navigation-container.collapsed{width:60px}.navigation-container.expanded{width:280px}.toggle-button{position:absolute;top:10px;left:10px;background:none;border:none;font-size:1.7rem;color:#f1f1f1;cursor:pointer;z-index:101}.sidebar{box-sizing:border-box;width:100%;padding:1.5rem;display:flex;flex-direction:column;height:100%;overflow-y:auto}.sidebar-header{margin-bottom:1.5rem;text-align:center}.sidebar-title{margin:0;font-size:1.8rem;font-weight:600;font-family:Helvetica Neue,Helvetica,Arial,sans-serif;color:#bbdefb}.sidebar-title-link{text-decoration:none}.course-list{list-style:none;padding:0;margin:0;flex-grow:1}.course-item{margin-bottom:1rem}.course-header{background:#3a3a3a;padding:.75rem 1rem;border-radius:4px;display:flex;justify-content:space-between;align-items:center;cursor:pointer;transition:background .3s,transform .3s;font-weight:500;font-size:1rem;color:#f1f1f1}.course-header:hover{background:#505050;transform:scale(1.02)}.course-header.active{background:#606060}.toggle-icon{font-size:1rem;min-width:20px;text-align:right;color:#bbdefb}.exercise-list{list-style:none;padding:.5rem 0 .5rem 1rem;margin:0}.exercise-item{margin-bottom:.5rem}.exercise-link{color:#bbdefb;text-decoration:none;transition:color .3s;font-size:.95rem}.exercise-link:hover{color:#90caf9}.logout-button{position:absolute;bottom:20px;left:50%;transform:translate(-50%);background:#dc3545;border:none;color:#fff;padding:.75rem 1rem;border-radius:4px;cursor:pointer;transition:background .3s;width:calc(100% - 40px);font-size:1rem}.logout-button:hover{background:#c82333}.dashboard-layout{display:flex}.dashboard-content{flex-grow:1;transition:margin-left .3s ease-in-out;padding:1rem}.dashboard-layout.collapsed .dashboard-content{margin-left:60px}.dashboard-layout.expanded .dashboard-content{margin-left:280px}.dashboard-container{padding:2rem;max-width:1200px;margin:0 auto;color:#333;background:#fff;border-radius:8px;box-shadow:0 2px 8px #0000001a}.dashboard-header{text-align:center;margin-bottom:2rem}.dashboard-header h1{font-size:2.5rem;margin-bottom:.5rem;color:#222}.dashboard-header p{font-size:1.2rem;color:#555}.course-overview{display:flex;flex-direction:column;gap:1.5rem}.course-card{background:#f9f9f9;padding:1rem;border-radius:8px;color:#333;box-shadow:0 2px 4px #0000001a}.course-title{margin:0 0 1rem;font-size:1.8rem;text-align:center;color:#222}.subpoints-list{list-style:none;padding:0;margin:0}.subpoint-item{margin-bottom:.5rem}.subpoint-link{text-decoration:none;color:#036;font-size:1rem}.subpoint-link:hover{text-decoration:underline;color:#024}.network-settings-container{padding:1rem}.network-settings-container h2{margin-bottom:1rem;font-size:2rem;text-align:center}.gateway-container{margin-bottom:2rem;text-align:center}.gateway-title{font-size:1.8rem;color:#333;margin-bottom:1rem}.host-card{background:#fff;border-radius:8px;padding:.5rem;box-shadow:0 2px 6px #0000001a;margin:0 auto 1rem;max-width:300px;overflow:hidden;transition:all .3s ease}.gateway-card{border:2px solid #3498db;background:#f0f8ff}.other-card{border:2px solid #f1c40f;background:#fff9e6}.host-card-header{display:flex;justify-content:space-between;align-items:center;cursor:pointer;padding:.5rem 1rem;background:#0000000d;border-radius:6px}.host-card-header h3{margin:0;font-size:1.2rem}.card-toggle-icon{font-size:1rem}.host-card-details{padding:.5rem 1rem}.host-field{margin-bottom:.75rem;display:flex;flex-direction:column}.host-field label{font-size:.9rem;margin-bottom:.25rem;color:#555}.host-field input,.host-field textarea{padding:.5rem;border:1px solid #ccc;border-radius:4px;font-size:1rem;width:100%;box-sizing:border-box}.host-field textarea{resize:vertical;overflow-y:auto}.save-button{padding:.5rem;background:#3498db;color:#fff;border:none;border-radius:4px;cursor:pointer;transition:background .3s;width:100%}.save-button:hover{background:#2980b9}.hosts-grid-wrapper{position:relative}.hosts-grid{display:flex;flex-wrap:wrap;align-items:flex-start;gap:1rem;justify-content:center}@media (max-width: 600px){.hosts-grid{flex-direction:column;align-items:center}}.wireguard-settings-container{padding:1rem;max-width:800px;margin:0 auto}.wireguard-settings-container h2{text-align:center;margin-bottom:1rem;font-size:2rem}.wireguard-config-code{background:#1e1e1e;color:#dcdcdc;font-family:Consolas,Courier New,monospace;font-size:.95rem;padding:1rem;border-radius:4px;white-space:pre-wrap;overflow-x:auto;border:1px solid #333;margin-bottom:1rem}.wg-section{color:#569cd6;font-weight:700}.wg-key{color:#9cdcfe}.wg-value{color:#ce9178}.copy-button{display:block;margin:1rem auto;padding:.75rem 1.5rem;background-color:#3498db;color:#fff;border:none;border-radius:4px;cursor:pointer;font-size:1rem}.copy-button:hover{background-color:#2980b9}.fit-vqdc-container{max-width:800px;margin:auto;font-family:Arial,sans-serif;text-align:center;padding:1rem}.fit-header,.fit-sub-header,.fit-section-title{color:#6c63ff}.fit-scale-container{display:flex;align-items:center;justify-content:center;gap:20px;flex-wrap:wrap;margin-bottom:1.5rem}.fit-scale-option{padding:10px;border-radius:50%;width:60px;height:60px;background-color:#e6e6fa;color:#333;font-weight:700;cursor:pointer;transition:background-color .3s;display:flex;justify-content:center;align-items:center;position:relative}.fit-scale-option:hover{background-color:#ddd7f0}.fit-scale-option.selected{background-color:#d0e7ff}.fit-tooltip{display:none;position:absolute;bottom:110%;left:50%;transform:translate(-50%);background:#000000bf;color:#fff;padding:6px 10px;border-radius:5px;font-size:.85rem;line-height:1.2;white-space:normal;z-index:10;width:180px;text-align:center}.fit-scale-option:hover .fit-tooltip{display:block}.fit-styled-select,.fit-input,.fit-select input[type=text]{padding:8px;width:100%;border:2px solid #6c63ff;background-color:#f8f8ff;border-radius:5px;font-size:16px;box-sizing:border-box}.fit-styled-select:focus,.fit-input:focus{outline:none;border-color:#6c63ff;background-color:#fff}.fit-styled-button{background-color:#e6e6fa;border:2px solid #ccc;color:#333;padding:12px 18px;border-radius:8px;font-size:1rem;cursor:pointer;margin-top:10px}.fit-styled-button:hover{background-color:#ddd7f0}.fit-error-message{color:red;margin-top:10px}.fit-submitted-info{margin-top:2rem;background-color:#f0f0ff;padding:1rem;border-radius:8px;text-align:left}.fit-container{max-width:800px;margin:auto;text-align:center;font-family:Arial,sans-serif;padding:1rem}.fit-title{color:#6c63ff;margin-bottom:20px}.fit-timeline{display:flex;flex-wrap:wrap;justify-content:center;gap:15px;background:#f8f8ff;padding:20px;border-radius:10px}.fit-drop-zone{width:120px;height:120px;border:2px dashed #bbb;background:#e6e6fa;display:flex;align-items:center;justify-content:center;font-weight:700;border-radius:10px;transition:background .3s}.fit-drop-zone img{width:100px;height:100px}.fit-image-box{width:120px;height:120px;cursor:grab}.fit-image-list{display:flex;flex-wrap:wrap;justify-content:center;gap:15px;margin-top:20px}.fit-quiz-question{background:#f9f9ff;padding:20px;border-radius:10px;margin-bottom:20px;text-align:left}.fit-quiz-question h3{color:#6c63ff}.fit-option-button{background-color:#e6e6fa;color:#333;padding:12px 18px;border:2px solid #ccc;border-radius:8px;cursor:pointer;margin:8px;font-size:1rem;width:45%}.fit-option-button.selected{background-color:#d0e7ff;border-color:#66afe9}.fit-option-button:hover{background-color:#ddd7f0}@media (max-width: 600px){.fit-option-button{width:100%}}@keyframes spinner{0%{transform:rotate(0)}to{transform:rotate(360deg)}}body{font-family:Segoe UI,sans-serif;background-color:#f0f2f5;color:#333;margin:0;padding:0;overflow:auto}.exercises-container{height:100vh;max-width:1200px;margin:0 auto;padding:20px;box-sizing:border-box;display:flex;flex-direction:column}.header{display:flex;justify-content:center;align-items:center;gap:10px;margin-bottom:10px}.header h1{margin:0;font-size:1.8rem}.max-points{font-size:1rem;font-weight:400;color:#666}.exercise-face{font-size:2rem}.motivation-message{text-align:center;font-size:1.2rem;color:#2a9d8f;margin-bottom:10px}.progress-bar-container{position:relative;height:40px;background:#e0e0e0;border-radius:20px;margin:10px auto 20px;width:80%;overflow:hidden}.progress-bar{height:100%;background:linear-gradient(to right,#2a9d8f,#00b894);transition:width .3s ease}.button-group{display:flex;justify-content:center;gap:10px;margin-bottom:10px}.rerun-button{background:#2a9d8f;color:#fff;padding:8px 14px;border:none;border-radius:6px;cursor:pointer;transition:background .3s ease}.rerun-button:hover{background:#21867a}.task-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:10px;flex-grow:1;overflow:auto}.current-points{font-size:1.2rem;color:#00b894;margin:0 10px}.exercise-task-card{background:#fff;border:2px solid #e0e0e0;border-radius:12px;padding:10px;box-sizing:border-box;transition:box-shadow .3s ease,transform .3s ease;cursor:pointer;position:relative}.exercise-task-card:hover{box-shadow:0 8px 16px #00000026;transform:translateY(-3px)}.active-task{border-color:#00b894;background-color:#f0fff4}.task-header{display:flex;justify-content:space-between;align-items:center}.status-badge{padding:4px 8px;border-radius:12px;font-size:.75rem;font-weight:700;text-transform:uppercase;color:#fff}.status-badge.loading{background-color:#f4a261;position:relative;padding-left:28px}.status-badge.loading:before{content:"";position:absolute;left:6px;top:50%;width:14px;height:14px;margin-top:-7px;border:2px solid #fff;border-top-color:transparent;border-radius:50%;animation:spinner .8s linear infinite}.status-badge.completed{background-color:#2a9d8f}.status-badge.error{background-color:#e76f51}.status-badge.pending{background-color:#bcbcbc}.task-details{max-height:0;overflow:hidden;transition:max-height .4s ease}.task-details.expanded{max-height:150px}.task-description,.task-points{margin:6px 0;font-size:.9rem}.task-button{background-color:#e9c46a;border:none;border-radius:6px;padding:6px 10px;font-size:.8rem;cursor:pointer;transition:background .3s ease;margin-top:4px}.task-button:hover{background-color:#d4a35a}.task-feedback{font-style:italic;font-size:.85rem;margin-top:4px}.error-message{color:#e76f51;font-weight:700}