*{margin:0;padding:0;box-sizing:border-box}:root{--primary-black: #0a0a0a;--secondary-black: #111111;--accent-yellow: #FFE665;--accent-dark-yellow: #E6D15C;--text-white: #ffffff;--text-gray: #cccccc;--text-dark-gray: #888888;--border-gray: #333333;--success-green: #00ff00;--warning-orange: #ffa500}body{font-family:Arial,sans-serif;background-color:var(--primary-black);color:var(--text-white);line-height:1.6}.header{background:var(--primary-black);border-bottom:2px solid var(--accent-yellow);padding:1rem 0;position:sticky;top:0;z-index:1000}.navbar{max-width:1200px;margin:0 auto;display:flex;justify-content:space-between;align-items:center;padding:0 2rem}.logo-link{text-decoration:none}.logo{color:var(--accent-yellow);font-size:2rem;font-weight:700;text-transform:uppercase;letter-spacing:2px}.nav-menu{display:flex;align-items:center;gap:2rem}.nav-link{color:var(--text-white);text-decoration:none;font-weight:500;transition:color .3s ease;text-transform:uppercase;font-size:.9rem;letter-spacing:1px}.nav-link:hover{color:var(--accent-yellow)}.nav-form{margin:0}.nav-button{background:var(--accent-yellow);color:var(--primary-black);border:none;padding:.5rem 1rem;border-radius:4px;cursor:pointer;font-weight:500;text-transform:uppercase;transition:background-color .3s ease}.nav-button:hover{background:var(--accent-dark-yellow)}.main{min-height:calc(100vh - 140px);padding:2rem 0}.welcome-container{max-width:1200px;margin:0 auto;padding:0 2rem}.hero-section{text-align:center;padding:4rem 0;background:var(--secondary-black);border-radius:10px;margin-bottom:4rem;border:1px solid var(--border-gray)}.hero-title{font-size:3.5rem;font-weight:700;margin-bottom:1rem;color:var(--accent-yellow)}.hero-subtitle{font-size:1.2rem;color:var(--text-gray);margin-bottom:2rem;max-width:600px;margin-left:auto;margin-right:auto}.hero-actions{display:flex;gap:1rem;justify-content:center;flex-wrap:wrap}.btn{padding:1rem 2rem;border:none;border-radius:6px;font-weight:700;text-transform:uppercase;text-decoration:none;text-align:center;transition:all .3s ease;cursor:pointer;display:inline-block;font-size:.9rem;letter-spacing:1px}.btn-primary{background:var(--accent-yellow);color:var(--primary-black)}.btn-primary:hover{background:var(--accent-dark-yellow);transform:translateY(-2px);box-shadow:0 4px 12px #ffe6654d}.btn-secondary{background:transparent;color:var(--text-white);border:2px solid var(--accent-yellow)}.btn-secondary:hover{background:var(--accent-yellow);color:var(--primary-black);transform:translateY(-2px)}.features-section{margin-top:4rem}.section-title{text-align:center;font-size:2.5rem;margin-bottom:3rem;color:var(--text-white);text-transform:uppercase;letter-spacing:2px}.features-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:2rem}.feature-card{background:var(--secondary-black);padding:2rem;border-radius:8px;border:1px solid var(--border-gray);text-align:center;transition:transform .3s ease,border-color .3s ease}.feature-card:hover{transform:translateY(-5px);border-color:var(--accent-yellow)}.feature-title{font-size:1.5rem;margin-bottom:1rem;color:var(--accent-yellow)}.feature-description{color:var(--text-gray);line-height:1.6}.auth-container{max-width:400px;margin:2rem auto;padding:0 1rem}.auth-form{background:var(--secondary-black);padding:2rem;border-radius:8px;border:1px solid var(--border-gray)}.auth-title{text-align:center;font-size:2rem;margin-bottom:2rem;color:var(--accent-yellow);text-transform:uppercase}.form{display:flex;flex-direction:column;gap:1.5rem}.form-group{display:flex;flex-direction:column}.form-label{margin-bottom:.5rem;color:var(--text-white);font-weight:500}.form-input{padding:.75rem;background:var(--primary-black);border:1px solid var(--border-gray);border-radius:4px;color:var(--text-white);font-size:1rem;transition:border-color .3s ease}.form-input:focus{outline:none;border-color:var(--accent-yellow)}.form-options{display:flex;align-items:center;gap:.5rem}.checkbox-label{color:var(--text-gray);font-size:.9rem}.checkbox{margin-right:.5rem}.submit-button{background:var(--accent-yellow);color:var(--primary-black);border:none;padding:1rem;border-radius:4px;font-weight:700;text-transform:uppercase;cursor:pointer;transition:background-color .3s ease;margin-top:1rem}.submit-button:hover{background:var(--accent-dark-yellow)}.auth-links{text-align:center;margin-top:1.5rem;padding-top:1.5rem;border-top:1px solid var(--border-gray)}.auth-link-text{color:var(--text-gray)}.auth-link{color:var(--accent-yellow);text-decoration:none}.auth-link:hover{text-decoration:underline}.computers-container{max-width:1200px;margin:0 auto;padding:0 2rem}.page-title{font-size:2.5rem;text-align:center;margin-bottom:3rem;color:var(--accent-yellow);text-transform:uppercase;letter-spacing:2px}.computers-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(350px,1fr));gap:2rem}.computer-card{background:var(--secondary-black);border:1px solid var(--border-gray);border-radius:8px;padding:1.5rem;transition:all .3s ease;position:relative}.computer-card:hover{transform:translateY(-5px);border-color:var(--accent-yellow);box-shadow:0 8px 25px #ffe66533}.computer-header{display:flex;align-items:center;gap:1rem;margin-bottom:1rem}.computer-status{width:12px;height:12px;border-radius:50%}.status-available{background:var(--success-green);box-shadow:0 0 10px var(--success-green)}.status-occupied{background:var(--accent-yellow);box-shadow:0 0 10px var(--accent-yellow)}.status-maintenance{background:var(--warning-orange);box-shadow:0 0 10px var(--warning-orange)}.computer-name{font-size:1.5rem;color:var(--text-white);margin:0}.computer-specs{margin-bottom:1rem}.specs-text{color:var(--text-gray);font-size:.9rem;line-height:1.5}.computer-price{font-size:1.25rem;font-weight:700;color:var(--accent-yellow);margin-bottom:1.5rem}.price-value{font-size:1.5rem}.reserve-form{margin-top:1rem}.hours-selector{display:flex;align-items:center;gap:1rem;margin-bottom:1rem}.hours-label{color:var(--text-white);font-weight:500}.hours-select{padding:.5rem;background:var(--primary-black);border:1px solid var(--border-gray);border-radius:4px;color:var(--text-white);min-width:100px}.btn-reserve{width:100%;background:var(--accent-yellow);color:var(--primary-black);border:none;padding:1rem;border-radius:4px;font-weight:700;text-transform:uppercase;cursor:pointer;transition:background-color .3s ease}.btn-reserve:hover{background:var(--accent-dark-yellow)}.computer-unavailable{text-align:center;padding:1rem;background:#ffe6651a;border-radius:4px}.unavailable-text{color:var(--accent-yellow);font-weight:700;text-transform:uppercase}.dashboard-container{max-width:1200px;margin:0 auto;padding:0 2rem}.user-info-section{background:var(--secondary-black);padding:2rem;border-radius:8px;border:1px solid var(--border-gray);margin-bottom:3rem}.user-info-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:1.5rem}.info-item{display:flex;justify-content:space-between;align-items:center;padding:1rem;background:var(--primary-black);border-radius:4px;border:1px solid var(--border-gray)}.info-label{color:var(--text-gray);font-weight:500}.info-value{color:var(--text-white);font-weight:700}.reservations-section{background:var(--secondary-black);padding:2rem;border-radius:8px;border:1px solid var(--border-gray)}.section-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:2rem;flex-wrap:wrap;gap:1rem}.reservations-list{display:flex;flex-direction:column;gap:1rem}.reservation-card{background:var(--primary-black);padding:1.5rem;border-radius:6px;border:1px solid var(--border-gray);transition:border-color .3s ease}.reservation-card:hover{border-color:var(--accent-yellow)}.reservation-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:1rem;flex-wrap:wrap;gap:1rem}.reservation-status{padding:.25rem .75rem;border-radius:20px;font-size:.8rem;font-weight:700;text-transform:uppercase}.status-active{background:#0f03;color:var(--success-green);border:1px solid var(--success-green)}.status-completed{background:#ffffff1a;color:var(--text-gray);border:1px solid var(--text-gray)}.status-cancelled{background:#ffe66533;color:var(--accent-yellow);border:1px solid var(--accent-yellow)}.reservation-details{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:1rem}.detail-item{display:flex;justify-content:space-between;align-items:center;padding:.5rem 0;border-bottom:1px solid var(--border-gray)}.detail-label{color:var(--text-gray)}.detail-value{color:var(--text-white);font-weight:500}.no-reservations{text-align:center;padding:3rem}.no-data-text{color:var(--text-gray);font-size:1.1rem;margin-bottom:1.5rem}.alert{padding:1rem;border-radius:4px;margin-bottom:1rem;border-left:4px solid}.alert-success{background:#00ff001a;border-color:var(--success-green);color:var(--success-green)}.alert-error{background:#ffe6651a;border-color:var(--accent-yellow);color:var(--accent-yellow)}.footer{background:var(--secondary-black);border-top:1px solid var(--border-gray);padding:2rem 0;margin-top:4rem}.footer-content{max-width:1200px;margin:0 auto;text-align:center;padding:0 2rem;color:var(--text-gray)}@media (max-width: 768px){.navbar{flex-direction:column;gap:1rem;padding:0 1rem}.nav-menu{gap:1rem}.hero-title{font-size:2.5rem}.hero-actions{flex-direction:column;align-items:center}.btn{width:100%;max-width:300px}.computers-grid{grid-template-columns:1fr}.section-header,.reservation-header{flex-direction:column;align-items:flex-start}.reservation-details{grid-template-columns:1fr}.hours-selector{flex-direction:column;align-items:flex-start}}@media (max-width: 480px){.auth-form{padding:1.5rem}.computer-card{padding:1rem}.user-info-section,.reservations-section{padding:1.5rem}}.reservation-actions{display:flex;gap:1rem;margin-top:1.5rem;padding-top:1.5rem;border-top:1px solid var(--border-gray);flex-wrap:wrap}.action-form{margin:0}.btn-cancel{background:transparent;color:var(--accent-yellow);border:2px solid var(--accent-yellow);padding:.75rem 1.5rem;border-radius:4px;font-weight:700;text-transform:uppercase;cursor:pointer;transition:all .3s ease;font-size:.8rem}.btn-cancel:hover{background:var(--accent-yellow);color:var(--primary-black)}.btn-delete{background:transparent;color:var(--text-gray);border:2px solid var(--text-gray);padding:.75rem 1.5rem;border-radius:4px;font-weight:700;text-transform:uppercase;cursor:pointer;transition:all .3s ease;font-size:.8rem}.btn-delete:hover{background:var(--text-gray);color:var(--primary-black)}.reservation-computer-info{flex:1}.reservation-specs{margin-top:.5rem}.specs-text{color:var(--text-gray);font-size:.85rem}@media (max-width: 768px){.reservation-actions{flex-direction:column}.btn-cancel,.btn-delete{width:100%;text-align:center}}