*{margin:0;padding:0;box-sizing:border-box;font-family:Courier New}body{background-color:#333;background-image:radial-gradient(#4a4a4a 1px,transparent 1px);background-size:20px 20px;min-height:100vh;display:flex;justify-content:center;align-items:center;color:#333;overflow:hidden}.nav-bar{display:flex;justify-content:space-between;align-items:center;padding:1rem 2rem;background-color:#000c;border-bottom:1px solid rgba(255,255,255,.1);width:100%;position:fixed;top:0;left:0;z-index:1000;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}.logo{font-size:1.5rem;font-weight:700;color:#fff}.app-container{display:flex;flex-direction:column;justify-content:center;align-items:center;min-height:100vh;width:100%;padding:1rem;position:relative}.loading-state,.error-state{background-color:#000;padding:2rem;text-align:center;border-radius:4px;box-shadow:0 0 20px #fff3}.loading-text{font-size:1.5rem;color:#ccc}.error-state{background-color:#000;color:#ff6b6b;border:1px solid #ff6b6b}.error-title{font-size:2rem;font-weight:700;margin-bottom:.5rem;color:#ff6b6b}.error-message{font-size:1.1rem;margin-bottom:.5rem;color:#fff}.error-sub-message{font-size:.9rem;opacity:.8;color:#ccc}.main-card-wrapper{background-color:#000;display:flex;flex-direction:column;align-items:center;justify-content:flex-start;width:100vw;height:100vh;position:fixed;top:0;left:0;z-index:1;padding-top:6rem}.auth0-logo{width:80px;margin-bottom:1rem}.main-title{font-size:1.8rem;color:#fff;text-align:center;margin-bottom:.5rem;font-weight:600}.action-card{background-color:transparent;padding:0;display:flex;flex-direction:column;align-items:center;gap:1.5rem;width:100%}.action-card .button{width:auto;display:inline-block;min-width:160px}.action-text{font-size:1rem;color:#ccc;text-align:center;line-height:1.5;font-weight:400}.button{padding:.8rem 2rem;font-size:1rem;border:none;cursor:pointer;background-color:#fff;color:#000;outline:none;border-radius:4px;font-weight:500;width:100%;transition:background-color .2s}.button:focus{outline:2px solid #fff;outline-offset:2px}.button.login{background-color:#fff;color:#000}.button.login:hover{background-color:#e0e0e0}.button.logout{background-color:transparent;color:#ff6b6b;border:1px solid #ff6b6b;width:auto;padding:.5rem 1rem}.button.logout:hover{background-color:#ff6b6b1a;color:#ff6b6b;transform:scale(1.05)}.button.top-right{position:absolute;top:1rem;right:1rem;z-index:1101;pointer-events:auto}.button.create-interview{background-color:#fff;color:#000;margin-bottom:1rem;width:auto;padding:.5rem 1.2rem;font-size:1.1rem}.button.create-interview:hover{background-color:#e0e0e0;transform:scale(1.05)}.logged-in-section{display:flex;flex-direction:column;align-items:center;gap:1.5rem;width:100%}.logged-in-message{font-size:1rem;color:#27ae60;font-weight:500}.profile-section-title{font-size:1.4rem;color:#fff;font-weight:600}.profile-card{padding:1rem}.profile-picture{transition:transform .3s ease-in-out;border:2px solid #333}.profile-picture:hover{transform:scale(1.05)}.interview-section{width:100%;display:flex;flex-direction:column;align-items:center;gap:1rem}.interviews-list{width:100%;display:flex;flex-direction:column;gap:.8rem;max-height:400px;overflow-y:auto;padding-right:.5rem}.interview-item{background-color:#111;padding:1rem;border:1px solid #333;border-radius:4px}.interview-info{display:flex;flex-direction:column;gap:.4rem}.candidate-name{font-size:1.1rem;font-weight:600;color:#fff;margin-bottom:.2rem}.interview-id{font-weight:600;color:#888;font-size:.9rem}.interview-created{font-size:.85rem;color:#ccc}.interview-status{display:flex;gap:.8rem;align-items:center;margin-top:.5rem}.status{padding:.2rem .6rem;font-size:.75rem;font-weight:500;border-radius:100px}.status.completed{background-color:#e6fffa;color:#27ae60;border:1px solid #27ae60}.status.pending{background-color:#fffaf0;color:#d69e2e;border:1px solid #d69e2e}.cheating{padding:.2rem .6rem;font-size:.75rem;font-weight:500;border-radius:100px}.cheating.detected{background-color:#fff5f5;color:#e53e3e;border:1px solid #e53e3e}.cheating.not-detected{background-color:#f0fff4;color:#38a169;border:1px solid #38a169}@media(max-width:600px){.nav-bar{padding:.5rem 1rem;background-color:#000000e6}.logo{font-size:1.2rem}.main-card-wrapper{padding:0;padding-top:5rem}.main-title{font-size:1.8rem}.button{padding:.5rem 1rem;font-size:.9rem}.auth0-logo{width:100px}.action-card{padding:1rem}}.modal-overlay{position:fixed;top:0;left:0;width:100%;height:100%;background-color:#000c;display:flex;justify-content:center;align-items:center;z-index:2000;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px)}.modal-content{background-color:#000;padding:2rem;border-radius:4px;width:90%;max-width:400px;box-shadow:0 0 30px #ffffff26;border:1px solid #333}.modal-title{font-size:1.5rem;color:#fff;margin-bottom:1.5rem;font-weight:600}.form-group{margin-bottom:1.2rem}.form-label{display:block;margin-bottom:.5rem;color:#ccc;font-size:.9rem}.form-input{width:100%;padding:.8rem;background-color:#111;border:1px solid #333;border-radius:4px;color:#fff;font-family:inherit;font-size:1rem}.form-input:focus{outline:none;border-color:#fff}.random-number-box{width:100%;padding:.8rem;background-color:#1a1a1a;border:1px solid #333;border-radius:4px;color:#4fd1c5;font-family:inherit;font-size:1.2rem;font-weight:600;text-align:center;letter-spacing:2px}.modal-actions{display:flex;justify-content:flex-end;gap:1rem;margin-top:2rem}.button.cancel-btn{background-color:transparent;color:#ccc;border:1px solid #333;width:auto;padding:.6rem 1.2rem}.button.cancel-btn:hover{background-color:#111;color:#fff}.button.confirm-btn{background-color:#fff;color:#000;width:auto;padding:.6rem 1.2rem}.button.confirm-btn:hover{background-color:#e0e0e0}