.lock{min-height:100vh;display:flex;align-items:center;justify-content:center;padding:2rem;background:linear-gradient(135deg,#1A1A1A,#242424)}.lock--loading{background:#1a1a1a}.lock__spinner{width:40px;height:40px;border:3px solid #333;border-top-color:#f90;border-radius:9999px;animation:spin .8s linear infinite}.lock__container{width:100%;max-width:380px;text-align:center}.lock__brand{margin-bottom:3rem}.lock__logo{font-family:GFS Neohellenic,serif;font-size:3rem;color:#f90;font-weight:700;letter-spacing:.05em;margin-bottom:.25rem}.lock__tagline{font-size:.875rem;color:#b0b0b0}.lock__form{background:#242424;border-radius:1rem;padding:3rem;box-shadow:0 10px 15px rgba(0,0,0,.5);margin-bottom:2rem}.lock__form--shake{animation:shake .4s ease-in-out}.lock__label{display:block;font-weight:600;color:#fff;font-size:.875rem;margin-bottom:.5rem;text-align:left}.lock__input{width:100%;padding:1rem;font-size:1.25rem;font-family:Inter,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif;border:2px solid #333;border-radius:.5rem;text-align:center;letter-spacing:.15em;transition:border-color .2s ease;background:#1a1a1a;color:#fff;margin-bottom:1.5rem}.lock__input:focus{outline:none;border-color:#f90;box-shadow:0 0 0 3px rgba(255,153,0,.15)}.lock__input:disabled{opacity:.5;cursor:not-allowed}.lock__input::placeholder{color:gray;letter-spacing:.2em}.lock__error{padding:.5rem 1rem;margin-bottom:1rem;background:rgba(244,67,54,.1);border:1px solid #f44336;border-radius:.25rem;color:#f44336;font-size:.875rem}.lock__submit{width:100%;padding:1rem;background:#f90;color:#fff;border:none;border-radius:.5rem;font-size:1rem;font-weight:600;font-family:Inter,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif;cursor:pointer;transition:all .2s ease;min-height:48px}.lock__submit:hover:not(:disabled){background:#e67e22;box-shadow:0 6px 20px rgba(255,153,0,.25)}.lock__submit:disabled{opacity:.5;cursor:not-allowed}.lock__hint{font-size:.75rem;color:gray}@keyframes shake{0%,to{transform:translateX(0)}20%{transform:translateX(-8px)}40%{transform:translateX(8px)}60%{transform:translateX(-4px)}80%{transform:translateX(4px)}}@keyframes spin{to{transform:rotate(1turn)}}@media(max-width:768px){.lock{padding:1rem}.lock__logo{font-size:2.5rem}.lock__form{padding:1.5rem}}